淡入淡出fadeOut似乎导致重叠

时间:2012-04-17 19:59:48

标签: javascript jquery jquery-ui

请参阅此jsfiddle:http://jsfiddle.net/kZA8D/

基本上,每当我快速浏览/通过链接时,都会显示college_box和landing_login_form div。重现可能需要几次,但最终看起来像这样:

enter image description here

发生了什么?我有一个简单的悬停功能,我不明白为什么会发生这种故障......

4 个答案:

答案 0 :(得分:2)

更新了链接:http://jsfiddle.net/J67Dr/1/

它是一个排队问题,在这种情况下.stop()不会削减它,因为它有两个不同的元素。因此,您最终会遇到一个元素被隐藏但仍有动画排队而另一个元素是动画的场景。我建议你使用.stop()作为最佳做法,.dequeue作为小提琴中的显示。

选项2

http://jsfiddle.net/4jv6B/

仅使用.stop,但淡化包装元素而不是项目本身。由于一些奇怪(见评论)我建议选项2.试图保留你的DOM,但哦,哦。

答案 1 :(得分:0)

这种情况正在发生,因为一旦添加了一些其他动画,事件队列上仍会有动画。您可能想查看jQuery的.stop()函数。

答案 2 :(得分:0)

基本上,一个动画在另一个完成之前就开始了。

我更新了你的小提琴来解决这个问题。一秒钟。

答案 3 :(得分:0)

正如在另一个答案中提到的那样,在Que中有动画,因为你没有删除它们,就像你经历的那样堆叠..修复它的方法是.stop(true),它会停止你附加的元素上的动画用于清除que的方法(因此为“true”)

这个小提琴:http://jsfiddle.net/kZA8D/4/ 修复它,(你的小提琴的一个小的重写),但它的错误,因为回调函数。