Ich versuche, animierte (kaum) Dropdown-Menüs zu erstellen. Die JS-Dateien sind verfügbar, wenn Sie sich die Quelle meiner Seite ansehen. Ich habe es im Grunde funktioniert.
Meine Frage ist: Wenn ich über etwas aus dem Hauptmenü schwebe und dann direkt zu dem Untermenü gehe, das auftaucht (unten), wenn ich dann über etwas in diesem Menü schwebe und es lasse, bleibt es.
http://lmiah.site11.com/slide%20down%20box%20menu%20new/mainTest.html
Um weniger verwirrend zu sein, werde ich ein direktes Beispiel geben:
Wenn Sie mit der Maus über "Karriere" fahren, fahren Sie geradeausBewegen Sie die Maus über "Mitarbeiterstimmen" und dann ganz nach unten, das Menü bleibt bestehen, bis Sie erneut über "Karriere" fahren.
Jede Hilfe wäre willkommen!
BEARBEITEN: Ich stelle fest, dass es etwas mit dem zu tun hat a href="# class="subMenuFloat" Wann immer ich über diese Links schwebe (sie sind diediejenigen in den versteckten Dropdowns) mein Dropdown-Div bleibt. Ich kann nicht herausfinden, warum dies passiert, aber wenn ich einfach über das Li schwebe und den Link verpasse, wird es ordnungsgemäß beendet.
Antworten:
0 für die Antwort № 1Demo: http://jsbin.com/welcome/13456
Beispiel ohne Verwendung des Menü-Plugins, dies ist nur ein Proof of Concept
$(function() {
var flag = false;
$("#mainMenu li.mainMenuItems").hover(function() {
if (!flag)
$(this).find(".submenu").slideDown(500);
}, function() {
if (!flag)
$(this).find(".submenu").slideUp(500);
});
$("#mainMenu li.mainMenuItems .submenu").hover(function() {
flag = true;
}, function() {
$(this).slideUp(500);
flag = false;
});
});
0 für die Antwort № 2
Dies ist ein häufiges Problem bei der Verwendung des HoversFunktion in jquery, weil Sie den verwendeten Selektor tatsächlich von einem Element zum anderen bewegen. Hier ist die Art und Weise, wie ich das gemacht habe: Grundsätzlich setzen Sie ein div oder li in das li Ihres Menüs. Beispiel:
<ul class="menu-hover">
<li class="menu one">Menu Option One
<div> Here is the drop down menu</div>
</li>
<li class="menu two">Menu Option One
<div> Here is the drop down menu</div>
</li>
</ul>
die jquery wäre
Grundsätzlich heißt das, wenn Sie mit dem Mauszeiger über eineWenn Sie sich im Menü befinden, blenden Sie alle Divs unter diesem Menü aus. Dies wären dann alle Menüs in Ihrem Dropdown-Menü. Sie müssen die li-Position relativ und das div absolut machen. Theoretisch ist das div also unter dem li enthalten und bleibt daher beim Schweben offen.
$(".menu-hover li").hover(function(){
//Hide each div on hover
$(".menu div").each(function(){
$(this).hide();
});
$("div", this).show();
});