Der Versuch, eine schnelle jQuery Drop-Down-Menü zu erstellen

Question

bin nicht sicher, ob ich das richtig mache, aber ich versuche, eine einfache Drop-Down-Menü in jQuery zu erstellen. Ich mag im Grunde ein div (mit Links), sobald der Menüpunkt angezeigt wird, schwebt über ..

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>

Die versteckte 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"); 
});

Nun blendet diese in der versteckten div und blendet es in Ordnung, aber - wie verhindere ich es vor dem Verblassen, wenn jemand neu auf etwas innerhalb des div dargestellt schwebt

Sorry, wenn dies eine wirklich offensichtliche Frage ist .. Ich bin immer noch lernen! :)

Answer 1

Ich glaube, Sie müssen den Umgang mit mouseover und mouseout Ereignisse trennen.

Vermutlich mögen Sie die mouseover Handler zum „obersten Ebene“ Menüelement, und die mouseout Handler auf den versteckten „Drop-Down“ div angebracht werden angebracht werden (mit einem gewissen Zustand Code zu verwalten Konflikte).