Вопрос

не уверен, правильно ли я это делаю, но я пытаюсь создать простое выпадающее меню в jQuery.В принципе, я хочу, чтобы div (со ссылками) появлялся при наведении курсора мыши на пункт меню..

Меню:

<ul id="mainlevel">
  <li><a href="#" class="mainlevel_home" ><span>Home</span></a></li>
  <li><a href="#" class="mainlevel_feature-writers" ><span>Feature Writers</span></a></li>
  <li><a href="#" class="mainlevel_fantasy-killed-my-hsc" ><span>Fantasy Killed My HSC</span></a></li>
</ul>

Скрытый Div:

<div class="subMenu"><a href="/feature-writers/jd-ormsby" class="sublevel jd-ormsby"><span>J.D. Ormsby</span></a></div>

С помощью jQuery:

$(".mainlevel_feature-writers").hover(function(){ 
  $(".subMenu").fadeIn("slow"); 
}, function() { 
  $(".subMenu").fadeOut("slow"); 
});

Теперь это исчезает в скрытом div и отлично исчезает, но - как мне остановить его исчезновение, если кто-то наведет курсор на что-то внутри недавно показанного div?

Извините, если это действительно очевидный вопрос..Я все еще учусь!:)

Это было полезно?

Решение

Я думаю, вам нужно разделить обработку mouseover и mouseout Мероприятия.

Предположительно, вы хотите, чтобы mouseover обработчик, который должен быть прикреплен к элементу меню "верхнего уровня", и mouseout обработчик, который должен быть прикреплен к скрытому "выпадающему" div (с некоторым кодом состояния для управления конфликтами).

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top