マウスがsubmneuから離れているときにサブメニューを隠す

Question

メニュー項目の上にマウスを置いたときに表示されるサブメニューを作成したいと思います。私は、マウスがサブメニューから離れているときにサブメニューを消したい、例えば、マウスがウェブサイトの下部または右または左に移動するなどの問題に直面する。ここ

は私のメニューのスクリプトです、私は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> 

に私のメニューのsapmleを作り、ここにスクリプトです

$("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

あなたにこれを追加jqueryのコード

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

これが役に立ちます。

は、私はちょうどそれが