Просмотр полной версии : вопросик по кнопкам(меню)
драсте
есть 3 каринки а, б, в.
вопрос, можно ли без флеша и явы сделать, чтобы они менялись?
а (картинка а)
a:hover (картинка б)
а:active (картинка в)
<!-- есть просто картинка а, наводим мышку картинка б -->
используя только css или html? или обязательно ява тут нужна?
:bye:
Zebestov
13.09.2010, 16:55
уже давно делаю разные роловеры и дропдауны на чистом CSS. самый идеальный подход делать картинку для кнопки "2 в 1":
!-----------------------------!
! обычный вид кнопки !
!-----------------------------!
!-----------------------------!
! навели мышку !
!-----------------------------!
CSS отдельно взятой кнопки будет выглядеть так
.navbar, .navbar:visited {
display: block;
width: <ширина кнопки>px;
height <высота кнопки>px;
background-image: url('images/моя_спаренная_картинка.png');
... ну а название кнопки лучше текстом
... который настраиваешь тут: фурнитура, отступы
}
.navbar:hover {
background-position: 0 -<высота кнопки>px;
}
главный плюс такого подхода (помимо оптимизации загрузки) заключается в 100% визуализации роловера по факту загрузки основного вида кнопки — ведь они же суть одна картинка, не нужны "предзагрузчики".
оффтп: о! сообщение #1`111 =)
ааааа :yahoo: Заработало! Круто! Спасибо большое!
.. Сейчас проверю на 5 кнопках и отпишусь...
Ваще супер... всё работает, и никакая ява не нужна.
Огромное спасибо тебе.
Ещё возник маленький вопросик...
вот есть уменя эта кнопка button1 есть div я делаю:
css файл:
#But1 {height: 50%;}
.Butt1, Butt1:visited {display: block; width: 244px; height: 45px; background-image: url('LastTest.gif'); background-repeat: no-repeat;}
.Butt1:hover {background-position: 0 -45px;}
html файл:
<div id="But1" align="center"> <!-- Это дает центр по ширине, но не по высоте. -->
<table width="244px" border="0" cellspacing="0" cellpadding="0">
<tr height=""></tr>
<tr height="45px"><td align="center"><div class="Butt1"><a href="#"/></a></div></td></tr>
</table></div>
Я не могу понять, как мне эту кнопку запереть ровненько по-центру страницы? И высоте, и ширине.
Работает на vBulletin ® версия 3.7.3. Copyright ©2000-2026, Jelsoft Enterprises Ltd. Перевод: zCarot
Copyright © 1999-2008 Flasher.ru. All rights reserved.