Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как сделать активный элемент при ховере (https://javascript.ru/forum/misc/12375-kak-sdelat-aktivnyjj-ehlement-pri-khovere.html)

Kolyaj 15.10.2010 22:40

CSS-меню, работающие по ховеру -- самые уродские самые неюзабельные меню. Чуть дрогнула рука с мышкой, выведя курсор за пределы меню, и с таким трудом раскрытые три уровня закрылись. А с тачпадом вообще жопа. Переместить мышь по диагонали к следующему уровню тоже невозможно.

subzey 15.10.2010 22:48

Для ие6 костыли или бихейвьер. Остальным css.

В конце-то концов, в России доля ie6 менше, чем у Opera Mini.

subzey 15.10.2010 22:52

Kolyaj,
Выпадающие меню с управлением исключительно позицией курсора все, вообще говоря, страшны и неюзабельны.

Kolyaj 15.10.2010 22:54

Да вообще все действия должны происходить только по клику, никак не по ховеру. (подсказки и подсветки это не действия)

subzey 15.10.2010 22:57

Именно. Вспомните в интерфейсе Виндов или Макоси хоть один элемент, который бы требовал правильного перемещения курсора мыши.

danik.js 16.10.2010 02:36

Цитата:

Сообщение от Kolyaj
CSS-меню, работающие по ховеру -- самые уродские самые неюзабельные меню.

Согласен. Горизонтальные еще ниче, а вот вертикальные..

Зато они работают и без js. Про доступность ничего не слышали? Про ненавязчивый js?
А с js что? Сам сталкивался неоднократно - страница недогружается и скрипт меню тупо отваливается - кайфово, да?

Если вам не нра резкость css, добавьте анимацию и задержки на js, но только ПОСЛЕ того как сделали рабочее на css.
Цитата:

Сообщение от subzey
Вспомните в интерфейсе Виндов или Макоси хоть один элемент, который бы требовал правильного перемещения курсора мыши.

Контекстное многоуровневое меню, неа? Лишние клики - всегда неудобно.

subzey 16.10.2010 10:32

danik.js,
Они не требуют даже наличия мыши как таковой. :)

danik.js 16.10.2010 11:32

Цитата:

Сообщение от subzey (Сообщение 74423)
danik.js,
Они не требуют даже наличия мыши как таковой. :)

Да, на css навигация на табах летит к чертям. Все изза "отсутствия" селектора по родителю, чета типа
.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; }

monolithed 16.10.2010 11:45

Уже несколько лет делаю выпадающие меню (даже по клику) на чистом CSS, примером могут послужить работы Stu Nicholls'a:
http://www.cssplay.co.uk/menus/ul-multi-four.html
http://www.cssplay.co.uk/menus/dl-clickslide.html

Kolyaj 16.10.2010 12:21

Цитата:

Сообщение от danik.js
Про доступность ничего не слышали?

Конечно слышали. Именно с доступностью у CSS-меню хреново. Они, конечно, работают, но пользоваться-то ими невозможно.


Часовой пояс GMT +3, время: 18:19.