Versuch, ein schnelles jQuery Dropdown-Menü zu erstellen

Question

Ich bin mir nicht sicher, ob ich das richtig mache, aber ich versuche, ein einfaches Dropdown-Menü in jQuery zu erstellen. Ich mag im Grunde ein div (mit Links) erscheinen, sobald der Menüpunkt schwebt über wird ..

Das Menü:

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

The Hidden Div:

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

Die jQuery:

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

Jetzt blendet es das versteckte div ein und blendet es aus, aber - wie verhindere ich das Ausblenden, wenn jemand auf etwas in dem neu gezeigten div schwebt?

Sorry, wenn das eine wirklich offensichtliche Frage ist .. Ich lerne immer noch! :)

Answer 1

Ich denke, Sie müssen die Behandlung von mouseover und mouseout Ereignisse trennen.

Vermutlich möchten Sie, dass der Handler mouseover an das Menüelement "oberste Ebene" angehängt wird und der Handler mouseout an das ausgeblendete drop "Dropdown" angehängt wird (mit einigen Statuscodes zum Verwalten von Konflikten).