首页 > 解决方案 > 新的 jQuery 动画暂停活动动画

问题描述

我遇到了一个奇怪的问题,即在已运行动画的同一包含区域内启动 jQuery 动画会导致旧动画停止。

请注意 - 问题不是同时运行多个动画,问题是在同一个容器标签内同时运行多个动画。

无论出于何种原因,当另一个动画已经在同一个包含区域内运行时开始一个新动画将导致前一个动画停止而新动画开始,但旧动画并没有完全停止,因为它的回调函数仍然在它之后被调用“完成”,它只是在新动画开始的第二秒停止动画。

这是用于启动动画的 javascript:

$("#" + randid).animate({marginTop: '+=450px'}, {duration: 2000, easing: "linear", complete: function() { removeMe($("#" + randid)) }});

继续并单击“开始动画”按钮几次,您会明白我的意思,如果一次有超过 1 个,则同一标签内的圆圈会中断。

jsfiddle:https ://jsfiddle.net/rkogvxps/4/

标签: jquery

解决方案


动画 HTML 应该使用 .append() 而不是 .html() 添加,我的 hacky 附加导致动画重置。


推荐阅读