jquery .stop() 在每次悬停时降低 div 的高度

Question

我制作了一个翻转菜单并使用 jquery 停止方法来防止当有人频繁进入和离开时出现的闪烁效果。但是在应用 jquery 停止方法并频繁执行 mouseenter 和 mouseleave 之后，主菜单的高度保持不变随着每次鼠标离开和重新进入操作而减少。这有点奇怪，我无法发现问题。

   $("#menu_container").on('mouseenter',function(){
        $("#lmenu").stop().slideDown(250);

    });

   $("#menu_container").on('mouseleave',function(){
     $("#lmenu").stop().slideUp(250);
   }); 

Answer 1

代替 .stop() 通常对我来说没有任何问题，还有另一种选择:检查动画完成

代码

var hov = $("#menu_container");
var shw = $("#lmenu");
hov.on('mouseenter',function(){
    if(!shw.is(':animated'))
    shw.slideDown(250);

});

hov.on('mouseleave',function(){
    shw.slideUp(250);
});

Demo Fiddle