在动画或slideUp / slideDown中使用stop()时的jQuery高度

我有一个隐藏子菜单的菜单。

当我鼠标hover在菜单项上时,我正在设置子菜单的动画,当我鼠标移出时,我会关闭。

当用户将鼠标放在很多菜单项上时,所有动画都会排队。

为了解决排队问题,我在动画之前添加了一个stop()。

这导致了更糟糕的问题,子菜单的高度减小到我鼠标移出时的大小。

通过在结束动画结束后将高度设置为自动来解决。

function leftMenuOut() { var obj = $(this).find(".toggleThisLevel2"); if (obj.length == 0) { return true; } $(this).removeClass("opened"); obj.stop().animate({ height: "hide" }, { queue: false, complete: function() { $(this).css("height", "auto"); } }); return false; } 

如果你在隐藏的元素上有填充,你会发现填充也会缩小。 只需添加一个包含元素,然后改变它的高度,但不要添加任何填充或边距。

这是一个已在jQuery 1.7.2中修复的错误: http : //bugs.jquery.com/ticket/8685

你为什么不使用切换function? 我认为你必须将ul元素的高度设置回原始高度。 目前高度保留在样式属性中,因此你的ul只有你将鼠标移出元素的高度。

您可以存储变量来存储菜单是否打开。

当您将鼠标hover在上方并打开菜单集var menuOpening = true; 然后回调开放动画设置menuOpening = false; 然后,您可以检查menuOpening是否只打开一个新的菜单项,如果它是假的。

然后你可以玩这个来获得看起来好多了的东西。 我以前有类似的工作,但找不到代码。

由于我通过Google发现了这个问题并且这些修复都不适合我,我应该提一下我是如何解决问题的。

这是我的原始代码:

 elem1.stop().slideUp(); elem2.find("div.page:nth-child(" + myVar + ")").stop().slideDown(); 

这导致高度在快速来回切换时被切断。

然后我在.stop()上的.stop .hide()之后添加了.stop()

 elem1.stop().slideUp(); elem2.find("div.page:nth-child(" + myVar + ")").stop().hide().slideDown(); 

现在,高度不会反弹,也不会被切断。 希望这有助于未来的人!