ナビゲーションメニューでマウスのホバーを10秒間表示する方法は？

Question

コード：このコードで

<style> 
    .subnav-show { 
    display: block; 
} 
</style> 

<script> 
$(document).ready(function() {  
    $('.nav li').hover(
     function() { 
      $('ul', this).addClass('subnav-show').delay(2000).queue(function(){ 
      $(this).removeClass('subnav-show').dequeue(); 
     });    
    }); 
}); 
</script> 

<div class="navbar navbar-default navbar-static-top"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="n-bar"></span> 
       <span class="n-bar"></span> 
       <span class="n-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#"><img src="logo.png" alt=""/></a> 
     </div> 
     <div class="navbar-collapse collapse "> 
      <ul class="nav navbar-nav"> 
       <li class="dropdown mega-dropdown"> 
        <a href="#" id="home" class="dropdown-toggle" data-toggle="dropdown" >home</a>    
        <ul class="dropdown-menu mega-dropdown-menu" id="div2"> 
         <li class="col-sm-3"> 
          <p>menu1</p> 
         </li> 
         <li class="col-sm-3"> 
          <p>menu2</p> 
         </li> 
         <li class="col-sm-3"> 
          <p>menu3</p> 
         </li> 
         <li class="col-sm-3"> 
          <p>menu4</p> 
         </li> 
        </ul>    
       </li> 
      </ul> 
     </div> 
    </div> 
</div> 

私は突然、メニューからメニュー非表示ダウン大きく低下し、マウスを削除すると、それはバーダウン大きなドロップを示し、ときに、メニュー上の私は、マウスオーバー、私は大規模なメニューナビゲーションバーを作成しています。今、私の質問は、メニュー上にマウスを重ねると10秒間大きなメニューバーを表示する方法です。メニューからマウスを削除すると、その後10秒間大きなメニューが表示されます。私を助けてください。

は

Answer 1

ありがとうございました、これを試してみてください：

https://www.bootply.com/64081

jQuery('ul.nav li.dropdown').hover(function() { 
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(100).fadeIn(); 
}, function() { 
    jQuery(this).find('.dropdown-menu').stop(true, true).delay(1000).fadeOut(); 
});