CSS-меню, работающие по ховеру -- самые уродские самые неюзабельные меню. Чуть дрогнула рука с мышкой, выведя курсор за пределы меню, и с таким трудом раскрытые три уровня закрылись. А с тачпадом вообще жопа. Переместить мышь по диагонали к следующему уровню тоже невозможно.
|
Для ие6 костыли или бихейвьер. Остальным css.
В конце-то концов, в России доля ie6 менше, чем у Opera Mini. |
Kolyaj,
Выпадающие меню с управлением исключительно позицией курсора все, вообще говоря, страшны и неюзабельны. |
Да вообще все действия должны происходить только по клику, никак не по ховеру. (подсказки и подсветки это не действия)
|
Именно. Вспомните в интерфейсе Виндов или Макоси хоть один элемент, который бы требовал правильного перемещения курсора мыши.
|
Цитата:
Зато они работают и без js. Про доступность ничего не слышали? Про ненавязчивый js? А с js что? Сам сталкивался неоднократно - страница недогружается и скрипт меню тупо отваливается - кайфово, да? Если вам не нра резкость css, добавьте анимацию и задержки на js, но только ПОСЛЕ того как сделали рабочее на css. Цитата:
|
danik.js,
Они не требуют даже наличия мыши как таковой. :) |
Цитата:
.menu li > a:focus < ul { display: block; } или .menu a:focus:parents(ul) { display: block; } С кодом .menu li:hover ul, .menu li a:focus + ul{ display: block; } подменю появляется при фокусе, но при последующем tab-переходе, на подпункты, оно скрывается. Зато на js это вродебы можно исправить. Кстати если кто подскажет как - буду благодарен. Надо както обробатывать события onfocus и отслеживать потерю фокуса и тд... UPD: помоему чета тут глючит. пишу : .menu a : focus : parents(ul) { display: block; } Да, действительно. глюк какойто. пишу так, но без пробелов: .menu a : focus : parents(ul) { display: block; } а получается так: .menu a:focus:parents(ul) { display: block; } |
Уже несколько лет делаю выпадающие меню (даже по клику) на чистом CSS, примером могут послужить работы Stu Nicholls'a:
http://www.cssplay.co.uk/menus/ul-multi-four.html http://www.cssplay.co.uk/menus/dl-clickslide.html |
Цитата:
|
Часовой пояс GMT +3, время: 23:58. |