新的jQuery动画会暂停活动动画

Question

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

请注意-问题不是同时运行多个动画，而是在同一容器标记中同时同时运行多个动画。

无论出于何种原因开始新动画，而另一个动画已在同一容纳区域中运行，则将导致先前动画停止并开始新动画，但旧动画并未完全停止，因为其回调函数仍在被调用“完成”后，它会停止动画，直到新动画开始播放的第二秒。

以下是用于启动动画的javascript：

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

继续几次，单击“开始动画”按钮，您将明白我的意思，如果一次添加的圆数超过1，则落入相同标签的圆会中断。

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

Answer 1

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