Установить цвет текста в активное состояние при выпадающем меню

Question

Установить цвет текста в активное состояние при выпадающем меню

0

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

Проблема, с которой я столкнулась, - это когда я выбираю элемент и затем наводил курсор на подменю, цвет основного элемента не будет оставаться активным. Я попытался добавить активный класс, но, похоже, не работает.

a:active {
    color: #F1F1F1;
}

Вот jsFiddle, который лучше объяснит проблему, с которой я столкнулся. Если бы кто-то не прочь проверить это для меня. Это было бы прекрасно.

Благодарю!

cwd 03 окт. 2013, в 23:37

Источник

Теги:

html

css

1 ответ

Ещё вопросы

SombreErmine · Accepted Answer · 2013-10-03T18-15-00.000Z

Поэтому проблема заключается в том, что цвет ссылки задается, когда вы наводите курсор на саму ссылку (элемент a). Вам нужно сделать так, чтобы цвет ссылки изменился, когда вы наведете элемент, содержащий ссылку и ее подменю, чтобы при наведении курсора на подменю вы все еще зависаете над содержащим элементом (элемент li)

Селектор child > используется здесь, так что ссылки подменю также не затрагиваются, когда вы зависаете над родительской ссылкой. Имейте в виду, что IE6 не понимает > селекторы; так что вам придется дать ребенку элементы классов, если вы хотите, чтобы они работали так далеко назад. a

CSS:

.sf-menu li:hover > a {
    color: #F1F1F1;
}

JSFiddle здесь.

1+ Я думал, что ОП хочет, чтобы :active состояние работало .. даже не заметил проблему выпадающего списка.
Хммм, я воспользовался вашим советом и проверил вашу скрипку, но при наведении курсора на подпункты текст верхней категории все еще не меняется на белый?
Хм, вы уверены, что посетили эту ссылку, а не предыдущую ссылку JoshC? jsfiddle.net/4c6Vj/4 Если вы уверены, какой браузер вы используете? Кроме того, вы имеете в виду, когда он находится в «режиме» смартфона?
Странно, это работает сейчас. Должно быть проблема с кешем В любом случае спасибо за помощь. Это работает сейчас! Спасибо!