Попытка создания быстрого выпадающего меню jQuery

Question

Я не уверен, что я делаю это правильно, но я пытаюсь создать простое выпадающее меню в 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?

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

Answer 1

Я думаю, вам нужно отделить обработку mouseover и mouseout событий.

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