jQuery懸停變得困惑

希望有人可以幫我弄清楚我使用jQuery時遇到的奇怪問題。我有一個奇幻的懸停繼續進行頁腳導航，並且每當我將鼠標懸停，然後回到沒有完成轉換的subnav時，它就會閃爍。所以這就是我的代碼明智。jQuery懸停變得困惑

的jQuery：

if($('#ft_navi .nav').length > 0){ 
    $('#ft_navi .nav ul').css('display', 'none'); /* if user doesn't have JS enabled, it will show everything for the customer */ 

    $("#ft_navi .nav > li").hover(function() { 
     $(this).find('ul').stop(true, true).show('slow'); 
    }, 
    function(){ 
     $(this).find('ul').stop(true, true).hide('slow'); 
    }); //end of hover 
} /* end of footer */

這裏的HTML：

<ul class="nav"> 
      <li class=""> 
      <a href="">Automotive</a> 
      <ul> 
       <li class=""><a href="">Overview</a></li> 
       <li class=""><a href="">Credit</a></li> 
      </ul> 
      </li> 
    </ul>

所以在細節什麼情況是，懸停/過掉作品很好，很正常，直到有人得到迅速用鼠標。如果你將鼠標懸停在最上面，然後在完成關閉之前將鼠標懸停在subnav上，那麼subnav就會不受控制地閃爍，並且不會停止。沒有停止功能，它就像這樣：

 $(this).find('ul').show('slow');

...只是使它快速打開和關閉。

感謝您的任何提示！

來源

2012-10-08 cbloss793

一種方法是在懸停增加延時：

http://jsbin.com/obenec/1/

if($('#ft_navi .nav').length > 0){ 
    $('#ft_navi .nav ul').css('display', 'none'); /* if user doesn't have JS enabled, it will show everything for the customer */ 

    $("#ft_navi .nav > li").hover(function() { 
    $(this).find('ul').stop(true,true).delay(300).show('slow'); 
    }, 
    function(){ 
    $(this).find('ul').stop(true,true).delay(300).hide('slow'); 
    }); //end of hover 
} /* end of footer */

來源

2012-10-08 18:06:49 jsweazy

完美！這似乎工作！非常感謝！！ – cbloss793

因爲沒有停止（如果它已經動畫，停止元素上的動畫），它會綁定顯示和隱藏懸停在元素上的次數。解決這個問題jQuery stop

來源

2012-10-08 18:04:36 Anoop

jQuery懸停變得困惑

回答

相關問題