CSS:hover и управление с клавиатуры
30.07.2010 технологии
Поставил себе Vimperator в FireFox (пока на него переезжаю с «Оперы») и тут же обнаружил, что многие мои продукты нифига не приспособлены для безмышевых пользователей. Админка TextPattern тоже не юзабельна.
Всё дело в том, что Vimperator может подсвечивать элементы для активации и даже эмулировать зависание курсора мыши над ними (:hover), однако, делает он это только для элементов a, input, textarea. Но ведь выпадающие менюшки создаются на CSS с применением псевдокласса :hover к элементу списка, а не к ссылке.
Пока не знаю, как решить эту проблему. Есть идеи?
Комментарии
Комментирование этой статьи закрыто.
Хм, и про атрибут title к ссылкам можно забыть? Не продуманно как-то. Надеюсь, я просто пока много не знаю.
А много таких? :) По мне — это уже жестяк. Поиск и выбор ссылки поиском и табом — ещё куда не шло. При том, что я сам заядлый шорткатщик.
Не много, конечно, но они есть. И эта проблема актуальна сейчас прежде всего для меня.
Насчёт жестяка не согласен, это очень удобно, ты не пробовал просто. Если бы решить ещё загвоздку с hover и title, вообще замечательно было бы.
Хммм…
Ну, первое, что приходит в голову… Это СПО, следовательно, «после сборки паровоза доработать напильником». Можно расширить плагин.
Кстати… Интересно, а у тебя при навигации по моему блогу ссылки в правом меню сдвигаются на :hover? =)
А еще я, кстати, тематичную иконку RSS прикрутил =)
Нет, не сдвигаются. Напильник не очень хорошая идея, потому что сработает только для «Вимператора», а что делать тем, кто с «Оперой»? Она, кстати, очень неплохо с клавиатуры управляется.
Нужно какое-то универсальное решение, но пока ничего хорошего в голову не приходит.
samlowry, дофига, пользователи смартфонов, различных touch-устройств
Che, кстати, да, спасибо. Я про тачскрины забываю постоянно, а ведь пользователей с такими штуками будет всё больше и больше.
Блин, как с ними вообще реализуется :hover? Глобальная проблемка-то.
:focus-покус попробуй
Так, блин, с ссылками-то проблем и нет, но любой псевдокласс для наружного элемента будет просто проигнорирован.
То есть если попытаться объяснить человеческим языком, надо что-то придумать, чтобы при наведении курсора (даже виртуального) на ссылку, можно было менять параметры родительского блока.
Менюшки ведь почти всегда примерно такие:
<ul id='menu'>
<li><a href='#' id='test'>видимый пункт</a></li>
<li><a href='#' id='hidden'>скрытый пункт</a></li>
</ul>
Нужно, чтобы при «наведении курсора» на #test появлялся #hidden. Но все менюшки работают так, что #hidden появляется только при наведении курсора на #menu.
jQuery в помощь. Все достаточно просто при мощи этого фреймворка реализуется.
Да не охота везде этого монстра пихать. Хотелось бы найти красивое решение совсем без JS.
Отключай css и будет у тебя всё видно :)
Вариант, конечно, но, блин, слишком много лишнего видно будет :) Мне нужна идея для проектирования web-интерфейсов, которыми одинаково хорошо можно было бы пользоваться как мышкой, так и с клавиатуры.
это проблема быдлобраузеров если я понял о чем ты говоришь, лечится – установкой нового браузера :)
Не, ты не понял. Или если вдруг понял правильно, тогда попробуй найти такой браузер, который давал бы доступ с клавиатуры к разворачивающимся меню, реализованных на CSS.
> однако, делает он это только для элементов a, input, textarea.
:h ‘hinttags’
btw, если у тебя есть вопросы про настройку, то лучше всего спрашивать на #vimperator@freenode
Спасибо. Однако, всё равно интерфейсы надо как-то иначе делать, продумывать универсальные решения. У меня уже есть идейка для Daos 2.0 и других продуктов.
Вот меню на css, можно с клавы лазить по нему
www.tjkdesign.com/ar…
Есть. Не создавай себе лишних проблем и не надо будет искать для них решения :)
Дело говорит.
Che, спасибо, работает. Но я посмотрел CSS и нифига не понял, в чём секрет. Вернее, почему мои меню не работают как надо. Принцип тот же. И ещё непонятно, как ты нашёл этот пример :) Keyboard friendly?
DimaX, ты просто не пробовал, вот и думаешь, что я ерундой страдаю. На работу с клавиатурой тяжело переходить, также как на Vim, но когда вкуришь — это как второе дыхание.
«css dropdown menu» :) но я его видел давно, где-то проскакивала ссылка на такого рода меню
Причем тут пробовал/не пробовал? Если 99.9% компьютерных юзеров юзают мышь (или ее аналоги, тачпад на ноуте и пр.) и их это вполне устраивает, то зачем создавать себе заморочки ради 0.1%!? Это с любой стороны нецелесообразно, как бы это ни было возможно удобно.
Вообще, я считаю, что привыкнуть можно к чему угодно и «удобство» понятие весьма субъективное. Кому не знакомо чувство неудобной клавы, при покупке другого ноута, или неудобной мыши, когда ее меняешь?
Но это рано или поздно проходит, и уже не вызывает негатива.
Точно так же и с управлением с одной только клавы. Когда привыкнешь, ощущения будут полностью аналогичными, как если рулишь мышью.
Все равно же надо руками/пальцами осуществлять манипуляции какие-то, какая особо разница, по клаве тыкать или по мышке.
Вот если, скажем, будет управление только мыслью, без физической активности, это совсем другое дело будет.
И такие технологии уже есть (управлению мыслью). Только они пока ненадёжные, дорогие и не очень удобные.
Зачем вообще делать менюшки на цсс выпадающими?
Можно сделать обычным html при нажатии переходит на страницу а на этой странице меню уже выглядит по другому с выпавшими элементами родительского меню на которое нажал. Это если простой вариант.
Но по моему лучше переделывать не все сайты а отправить разработчиками багтрек и объяснить в чем суть, и реализацию сразу предложить. Например что бы если он засекает в коде псевдоклассы заменял все простым древовидным хтмл меню и все. Будет скорее всего перекашивать дизы но зато информативность будет на уровне.