Jump to content
  • 0

Помогите пожалуйста СРОЧНО


NikNak
 Share

Question

Доброго времени суток Всем!!!

У меня проблема стала с активной кнопкой которую делал через компонент -=rollover=-.

Делаю сайт для своего клана и хотел сделать красивые кнопки при наведении на которуе стандартное изображение меняется на новое.

Делал вот так:


A.rollover {
background: url(gun.png); /* Путь к файлу с исходным рисунком */
display: block; /* Рисунок как блочный элемент */
width: 90px; /* Ширина рисунка */
height: 301px; /* Высота рисунка */
}
A.rollover:hover {
background: url(gun01.png); /* Путь к файлу с заменяемым рисунком */
}

Всё конечно получилось и кнопочка работает.

Но трабл заключается в том, что мне нужно сделать таких кнопок 10 штук (ну или хотя бы 3 обязательно).

И как сделать это с таким комопонентом даже ума не приложу.

Пробовал даже запихнуть как отдельный стиль и указав путь к нему всё равно ни чего не сработало.

Помогите пожалуйста. Может что другое использовать и если есть код то покажите ПОЖАЛУЙСТА.

Из-за этих кнопок у меня дизайн получается не использованный.

Link to comment
Share on other sites

14 answers to this question

Recommended Posts

  • 0

Доброго времени суток Всем!!!

У меня проблема стала с активной кнопкой которую делал через компонент -=rollover=-.

Делаю сайт для своего клана и хотел сделать красивые кнопки при наведении на которуе стандартное изображение меняется на новое.

Делал вот так:


A.rollover {
background: url(gun.png); /* Путь к файлу с исходным рисунком */
display: block; /* Рисунок как блочный элемент */
width: 90px; /* Ширина рисунка */
height: 301px; /* Высота рисунка */
}
A.rollover:hover {
background: url(gun01.png); /* Путь к файлу с заменяемым рисунком */
}

Всё конечно получилось и кнопочка работает.

Но трабл заключается в том, что мне нужно сделать таких кнопок 10 штук (ну или хотя бы 3 обязательно).

И как сделать это с таким комопонентом даже ума не приложу.

Пробовал даже запихнуть как отдельный стиль и указав путь к нему всё равно ни чего не сработало.

Помогите пожалуйста. Может что другое использовать и если есть код то покажите ПОЖАЛУЙСТА.

Из-за этих кнопок у меня дизайн получается не использованный.

а для каждой кнопки новое изображение что ли? Или везде будет одинаковое?

Link to comment
Share on other sites

  • 0

а для каждой кнопки новое изображение что ли? Или везде будет одинаковое?

Да для каждой кнопки будет отдельное изображение.

Учитывая что на одно изображение требуется 2 картинки, то для 3 кнопок 6 картинок, а для 10 кнопок 20 картинок.

Но картинки я нарисовал, а вот как заставить работать всё это ума не приложу :o

Edited by NikNak
Link to comment
Share on other sites

  • 0

а для каждой кнопки новое изображение что ли? Или везде будет одинаковое?

Да для каждой кнопки будет отдельное изображение.

Учитывая что на одно изображение требуется 2 картинки, то для 3 кнопок 6 картинок, а для 10 кнопок 20 картинок.

Но картинки я нарисовал, а вот как заставить работать всё это ума не приложу :o

так а зачем тогда роловер?

Вы каждой ссылке вешайте класс с отдельным фоном.

Вот так:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<head>
<META http-equiv="Content-Type" content="text/html; CHARSET=Windows-1251">
<title>Фон</title>
<style type="text/css">
body{
margin:0;
padding:0;
}


.pervaya{
width:186px;
height:46px;
display:block;
background:url(images/fon.png) no-repeat;
}
.pervaya:hover{
background:url(images/fon1.png) no-repeat;
}

.vtoraya{
width:186px;
height:46px;
display:block;
background:url(images/fon.png) no-repeat;
}
.vtoraya:hover{
background:url(images/fon2.png) no-repeat;
}

.tretya{
width:186px;
height:46px;
display:block;
background:url(images/fon.png) no-repeat;
}
.tretya:hover{
background:url(images/fon3.png) no-repeat;
}
</style>
</head>
<body>

<a href="#" class="pervaya">первая ссылка</a>
<a href="#" class="vtoraya">вторая ссылка</a>
<a href="#" class="tretya">третья ссылка</a>

</body>
</html>

если на ИЕ 6 наплевать, то и вовсе можно на блоки вешать фон. Например на список.

Edited by Softlink
Link to comment
Share on other sites

  • 0

Ой!!! Спасибо большое!!! Даже ОГРОМНОЕ при ОГРОМНОЕ :yahoo:

Сейчас пойду тестить :blink:

Мне ент дело в табличку ставить. Оно ведь безразници куда вставлять :blink:

А на ослика мне плевать хотя и жалко занудку :rolleyes:

Link to comment
Share on other sites

  • 0

Ой!!! Спасибо большое!!! Даже ОГРОМНОЕ при ОГРОМНОЕ :yahoo:

Сейчас пойду тестить :blink:

Мне ент дело в табличку ставить. Оно ведь безразници куда вставлять :blink:

А на ослика мне плевать хотя и жалко занудку :rolleyes:

на здоровье! Хоть где оно будет работать.

Если ие поддерживаете, тогда делайте как написал, ибо hover для блоков он не понимает.

Link to comment
Share on other sites

  • 0

на здоровье! Хоть где оно будет работать.

Обязательно кину ссылочку на сайтик в личку как доделаю :D

А так это сайтик для моего клана BrooklynSaints в онлайн игре Point Blank.

Уж стрелять-то хоть научился, а вот вёрстку надо штудировать!!!

Edited by NikNak
Link to comment
Share on other sites

  • 0

на здоровье! Хоть где оно будет работать.

Обязательно кину ссылочку на сайтик в личку как доделаю :D

А так это сайтик для моего клана BrooklynSaints в онлайн игре Point Blank.

Уж стрелять-то хоть научился, а вот вёрстку надо штудировать!!!

ага, только в личку не получится. :D Вам надо набрать 30 сообщений для этого.

Link to comment
Share on other sites

  • 0

ага, только в личку не получится. :D Вам надо набрать 30 сообщений для этого.

Для такого дела наберём :lol:

У меня всё работает!!! теперь так здорово и голова больше не болит :yahoo: Не смотря на то что всю ночь не спал!!!

А не подскажете будет ли это работать если эти стили запихнуть в отдельный text.css файл и указать к нему путь?

Link to comment
Share on other sites

  • 0

ага, только в личку не получится. :D Вам надо набрать 30 сообщений для этого.

Для такого дела наберём :lol:

У меня всё работает!!! теперь так здорово и голова больше не болит :yahoo: Не смотря на то что всю ночь не спал!!!

А не подскажете будет ли это работать если эти стили запихнуть в отдельный text.css файл и указать к нему путь?

собственно так делать и надо. B) Как бы правило хорошего тона - заталкивать стили в отдельный файл.

p.s. всю ночь на такую задачу - это конечно перебор)) Почитайте мат. часть :)

Edited by Softlink
Link to comment
Share on other sites

  • 0

p.s. Почитайте мат. часть :)

Да перечитывать по новой надо...

Давненько уже так не занимался дизом сайтиков.

Всю ночь играл, а потом сел делать и 4 часа просто в пустую.

То там ошибка, то там... Вобщем обратно учится надо.

Помню авторы данного сайтика хотели сделать ещё такой же про PHP.

Не в курсе они сделали или нет?

Link to comment
Share on other sites

  • 0

p.s. Почитайте мат. часть :)

Да перечитывать по новой надо...

Давненько уже так не занимался дизом сайтиков.

Всю ночь играл, а потом сел делать и 4 часа просто в пустую.

То там ошибка, то там... Вобщем обратно учится надо.

Помню авторы данного сайтика хотели сделать ещё такой же про PHP.

Не в курсе они сделали или нет?

это уже отдельный разговор. Если хотите, создайте тему во флейме, да спросите.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy