2017-08-07 78 views
0

代碼hoverintent交換了mouseenter我有一個使用hoverintent推遲下拉一個大型的菜單,我還設置了菜單燈箱效果,但是代碼使用了mouseenter和鼠標離開,問題是,雖然下拉有一個延遲燈箱效果doent,所以只要鼠標經過燈箱被觸發。有什麼辦法可以將下面的代碼改爲使用hoverintent而不是mouseenter/mouseleave?在巨型菜單收藏

<script> 
     $(document).ready(function() { 
if (document.documentElement.clientWidth > 801) { 
      $("#mega-menu").mouseenter(function() {    
        $("#mm-nav-overlay").toggle();   
        }).mouseleave(function() {  
      $("#mm-nav-overlay").hide(); 
        }); 
}  
}); 
</script> 

非常感謝

回答

0

所以我最終選擇了替換上面的代碼:

$(document).ready(function() { 
if (document.documentElement.clientWidth > 801) { 
     $("#mega-menu").mouseenter(function() { 
     timer = setTimeout(function(){ 
       $("#mm-nav-overlay").toggle(); 
      },200/* <--- the delay */) 
       }).mouseleave(function() { 
       clearTimeout(timer); 
     $("#mm-nav-overlay").hide(); 
       }); 
}  
});