Untermenü ausblenden, wenn sich die Maus vom Submenü entfernt

Question

Ich möchte ein Untermenü erstellen, das angezeigt wird, wenn Sie mit der Maus über das Element des Menüs fahren. Ich habe das Problem, dass das Untermenü verschwinden soll, wenn sich die Maus nicht im Untermenü befindet, z. B. wenn sich die Maus nach unten oder nach rechts oder links bewegt.

hier ist das Skript meines Menüs, ich sapmle mein Menü mache in jsfiddle http://jsfiddle.net/2jUQS/1/

<div id="header"> 
    <ul id="menu"> 
    <li> 
     <a href="#" class="wordsMenu">About Company</a> 
    </li> 
    <li> 
     <a href="#" class="galaryMenu">Gallary</a> 
    </li> 

</ul> 
</div> 
    <div id="submenus"> 
     <div id="galarySubMenu" class="subMenuContainer"> 
    <ul class="subMenuList"> 
     <li><a href="PhotoGallery.php">Photo Gallary</a></li> 
     <li><a href="videoGallery.php">Video Gallary</a></li> 
    </ul> 
</div> 

</div> 

und hier ist das Skript

$("document").ready(function(){ 


    $("a.wordsMenu").bind('mouseover',function(){ 
    $("#galarySubMenu").fadeOut("fast"); 
    }); 

$("a.galaryMenu").bind('mouseover',function(){ 


    $("#galarySubMenu").css("display","block"); 
    var margin_top = $("#header").height(); 
    var testMarginTop=parseInt($("#galarySubMenu").css("top")); 
    if(testMarginTop<0){ 
     $("#galarySubMenu").animate({ 
      'top':margin_top-2 
     }, { 
     'duration':500, 
     queue:false 
    }); 
    } 
    else{ 
     $("#galarySubMenu").animate({ 
      'top':'-300' 
     }, { 
     'duration':500, 
     queue:false 
    }); 
    } 
}); 

/* 
$(".subMenuList").mouseout(function(){ 
     $("#galarySubMenu").fadeOut("fast"); 
}); 
*/ 

}); 

Answer 1

append Sie dies jquery Code

$("#submenus").on('mouseleave',function(){ 
     $("#galarySubMenu").animate({ 
       'top':'-300' 
      }, { 
      'duration':500, 
      queue:false 
     }) 
    }) 

hoffe das hilft

Habe ich nur einen Handler auf die gesamte Untermenüs div, dass, wenn mouseleaves es ausblendet