Swap mouseenter pour hoverintent dans le code pour mega menu lightbox

Question

J'ai un menu mega qui utilise le hoverintent pour retarder le menu déroulant, j'ai également mis en place un effet de lightbox pour le menu, mais le code utilise mouseenter et mouseleave, le problème est que tandis que la liste déroulante a un retard de l'effet de boîte à lumière, alors dès que la souris passe au-dessus de la boîte à lumière est déclenchée. Est-il possible que le code ci-dessous peut être modifié pour utiliser hoverintent au lieu de 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> 

Merci beaucoup

Answer 1

J'opté à la fin pour remplacer le code ci-dessus:

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