在巨型菜单收藏

Question

代码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> 

非常感谢

Answer 1

所以我最终选择了替换上面的代码：

$(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(); 
       }); 
}  
});