Как активировать 1 элемент меню?

Question

[Ilya Bobkov]

Всем привет! У меня есть меню:

<ul id = "nav">
  <li><a href="#" id = "menu_base">		Реквизиты</a></li>
  <li><a href="#" id = "menu_personal">	Персонал</a></li>
  <li><a href="#" id = "menu_worktime">	Время работы</a></li>
  <li><a href="#" id = "menu_options">	Дополнительно</a></li>
  <li><a href="#" id = "menu_fotos">	Фотографии</a></li>
  <li><a href="#" id = "menu_story">	История</a></li>
  <li><a href="#" id = "menu_reg">		Регистрация</a></li>
  <li><a href="#" id = "menu_close">	Назад</a></li>
</ul>

и есть стили к этому меню:

#nav 
{
   width:10%; 
   position:absolute; 
   right:0px; 
   top:150;
   text-align: center;
   margin: 35px;
   border: 1px solid rgb(40,40,40);
}

 #nav li a 
{
	align: right;
    display: block;
	margin: 8px;
    color: rgb( 250, 150, 50 );
}

#nav li a:hover, #nav li a.active 
{
    background: rgb( 240, 240, 240);
    color: rgb( 250, 100, 10 );
}

#nav li 
{
    list-style-type: none; /* Убираем маркеры */
}
#nav ul 
{
    margin-left: 0; 	/* Отступ слева в браузере IE и Opera */
    padding-left: 0; 	/* Отступ слева в браузере Firefox, Safari, Chrome */
}

Вопрос такой: как активировать 1 элемент в меню, т.е. установить hover c помощью jquery?

Answer 1

[Eugene_Sh]

$('#nav li a').hover(function() {
   $(this).addClass('active');
}, function() {
   $(this).removeClass('active');
});

Или:

$('#nav li a').on('mouseenter', function() {
   $(this).addClass('active');
});

$('#nav li a').on('mouseleave', function() {
   $(this).removeClass('active');
});

Comments

[Ilya Bobkov]

не срабатывает

[Eugene_Sh]

Илья Бобков: jsfiddle.net/b9c7utp0 убрал css'ный hover - работает js'сный hover.

[Eugene_Sh]

Илья Бобков: К элементу a добавляется класс active и убирается после.

[xmoonlight]

Eugene_Sh: .toggle() не лучше?

[Eugene_Sh]

xmoonlight: Ну если hover, то лучше hover. Toogle он на click.

[xmoonlight]

Eugene_Sh: а-а. ясн. пасиб.

Answer 2

[Ilya Bobkov]

сделал так:

$( "#nav li a" ).click(function() 
			{
				$( "#nav li a" ).removeClass('active');
				$(this).addClass( 'active' );
			});
			
			$( "#menu_base" ).click();

Comments

[Eugene_Sh]

Тогда не совсем понятно, зачем в вопросе "установить hover c помощью jquery". И при клики на ссылку у тебя перезагружается страница.

[Ilya Bobkov]

Eugene_Sh: ошибся, active точнее наверное будет, и бог с ней с перезагрузкой