Как сделать активный элемент при ховере
 

есть такое меню

<ul>
<li><a href="#">Металопрокат</a></li>
 <li>
            	<a class="png" href="#">Услуги</a>
            	<ul>
                	<li><a href="#">Профнастил</a></li>
                    <li><a href="#">Металопрокат</a></li>
                    <li><a href="#">Мобильные модульные здания</a></li>
                    <li><a href="#">Гнутые профиля</a></li>
                </ul>
            </li>
 <li><a href="#">Гнутые профиля</a></li>
</ul>

я сделал его выпадающим выпадает это

<ul>
                	<li><a href="#">Профнастил</a></li>
                    <li><a href="#">Металопрокат</a></li>
                    <li><a href="#">Мобильные модульные здания</a></li>
                    <li><a href="#">Гнутые профиля</a></li>
                </ul>

но теперь хочу вернуться в родительский li

<li>
      <a class="png" href="#">Услуги</a>
       <ul>..я тут сейчас..</ul>
</li>

и дописать в li класс, но как это сделать именно к нему, выходит выбрать все li этот и те что в вып. меню(

Был бы очень благодарен за помощь.

Сам то понял че написал?

конечно понял.

По шагам еще раз.

1. Есть такое меню

<ul>
<li><a href="#">Металопрокат</a></li>
 <li>
            	<a href="#">Услуги</a>
            	<ul>
                 <li><a href="#">Профнастил</a></li>
                    <li><a href="#">Металопрокат</a></li>
                    <li><a href="#">Мобильные модульные здания</a></li>
                    <li><a href="#">Гнутые профиля</a></li>
                </ul>
            </li>
 <li><a href="#">Гнутые профиля</a></li>
</ul>

2. На ссылках основного на hover весит фон
3. Выпадает меню у меня так

function openSubmenu(){
			$(this).find('ul').css('visibility', 'visible');
			
	}
	
	function closeSubmenu(){
			$(this).find('ul').css('visibility', 'hidden');
	}
	
	$(".top_menu li").bind("mouseover", openSubmenu);
	$(".top_menu li").bind("mouseout", closeSubmenu);

4. При перемещении курсора в список тот который выпал пропадает естественно ховер на ссылке.
5. Я хочу сделать чтобы ссылка или li основного меню оставалась подсвечиваемой чтобы видеть что я в этом меню
6. Для этого хочу в li на которой $(".top_menu li").bind("mouseover", openSubmenu) дописать класс и использовать класс cur
7. При $(".top_menu li").bind("mouseout", closeSubmenu); удалить класс cur

8. Не могу после $(this).find('ul').css('visibility', 'visible'); добраться по DOM вверх к li (родителя элемента ul) и дописать ему класс cur


Вот и все, кто нибудь подскажет?

Все я разобрался, почему не видел результата при использов. просто .parent() :)

Это делается не на js а на чистом css:

.top_menu ul{
    display: none;
}
.top_menu li:hover ul{
    display: block;
}
.top_menu>li:hover>a{
    color: red;
}

Это так, набросок, можешь погуглить.

не вижу в этом смысла.

Сожалею...

в смысле сожалею?

от чего мы уходим к чему вернемся при использованию только css
если на чистом css сожалею именно тебе

за гавнокод программисты отдельно поблагодарят

А css всё ж милее, всех красивей и белее.

subzey, хорошо
далеко не будем, мне нужно ие6 included

какова реализация будет?

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

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

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

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

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

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

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

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

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

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; }

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

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

monolithed, не перебирая браузеры захожу с которого сейчас сижу - Хром!

О чудо! Я не могу вообще попасть в сабменю, кликаю оно разворачивается и сразу же сворачивается:blink:

мне кажется вы лукавите

Читать умеете?
Ну конечно такие менюшки делаются for fan, на практике лучше js.
Но и когда делают так что без js нифига не работает - это просто убивает. Это в веб-приложении можно такое позволить, но не на обычном сайте, нет.
Почитайте про "ненавязчивый js".
Каждый раз проверяю работоспособность создаваемого сайта с отключенным js. Ведь тупо изза недогруженного скрипта или откюченного js посетитель не сможет походить по ссылкам, или того хуже, сделать заказ в форме, на которую повешана валидация и ajax-отправка. Имхо это пережиток прошлого, либо чрезмерная увлеченность или слабые знания js кодеров.
Если js работает - форма должна аякснуться, меню должно плавно выпасть или спрятаться, спойлеры и табы быть скрытыми и тд. Если выключен - ничто не должно "умереть" - а просто раскрыться и быть доступным. я не прав?

частичная эмуляция события onclick на CSS существует с появления псевдоклассов link, active, hover, visited, а они появились очень давно и даже всем известный Stu Nicholls не был в этом первым

За те 8 лет, что я знаком с CSS было сделано десятки разных меню как с использованием JS так и без и если речь идет о создании к.л. ролловера, то безусловно я это сделаю на CSS/HTML, но если что-то по серьезней - где нужен интерактив или цепочки событий то без JS не обойтись.

я зашел посмотреть на результат.

Safari and Google Chrome have a problem with their interpretation of the mouse click.

Эту поправку прилепишь рядом с меню?

Открывал меню где якобы работает. Пользователю нужно проявить необыкновенную смекалку чтобы его открыть)

кстати, дайте угадаю вы наверно и табличные данные верстаете дивами.

Читать все еще не научились?А это еще зачем? Во всем стараюсь придерживаться логики и простоты. Это сохраняет мозг и время. Ради этих целей прекращаю этот гнилой спор с вами.

danik.js, слушай
1. Я тебя сюда не звал
2. Мне нужно было решить задачу
3. Я ее решил, остальной флуд для меня составил 0 пользы
4. как я использую для чего либо, это мои проблемы, моя реализация имеет право на существование
5. Твое мнение меня не интересует, делаешь на css делай мне это не интересно... я писал(с чтением видно у тебя беда, только комплексуешь видно и мне пишешь, то там не прочитал то тут, мне это гамно не нужно зачем мне его читать)
6. Хочешь показаться умным, делай это в другом месте, а не в моем топике, проблему решил, ты мне в этом не помог, объяснил проблему доходчиво! На балаболил за-то еще на 2 страницы с своим чистым css
7. Не думай если ты что-то считаешь по своему - другие должны тоже так считать.
8. Не пиши на вы если сразу начал тыкать! будь самим собой
9. сам спор развел сам и закончил! молодец.