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悬停变得困惑

回答

相关问题