javascript - JQuery animate() - 停止所有动画

Question

我有一个关于停止多个动画的问题，我在下面有一些伪代码来显示我的情况:

CSS

#aDiv
{
    position: absolute;
    background-image: url("gfx/nyancat.png");
    width: 46px;
    height: 50px;
    background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
}

JQUERY

    function doAnimate(aDiv)
    {
    $(aDiv).animate({   //do stuff for first animation
                            height: (H*2)+"px",
                            width:  (W*2)+"px",
                            left: "-="+(W*0.5)+"px",
                            top: "-="+(W*0.5)+"px",
                            opacity: 1

                }, 500 , "linear", function()
{ $(aDiv).animate( //do stuff for second animation
                {
                        height: H+"px",
                        width:  W+"px",
                        left: "+="+(W*0.5)+"px",
                        top: "+="+(H*0.5)+"px",
                        opacity: 0.01

                }, 500, function()
                        {   //call itself
                            doAnimate( aDiv );
                        }
                    );
                }
        );
}

//somewhere else in the code
doAnimate(aDiv);

当我在 aDiv ( $(aDiv).stop() ) 上调用 stop() 函数时，这会停止两个动画吗？我问的原因是因为我有一个在窗口加载时调用的动画 div，但是在调用停止然后重新启动动画时 - 动画没有像以前那样运行所以我必须刷新页面。谢谢

编辑:fiddle added

Answer 1

只需使用 .stop() 即可满足我的要求。我使用的是 JQuery 1.7，所以我无法使用 .finish() 功能。对于我的问题，将背景大小 css 值从自动更改为原始值(在我的情况下为 55%)似乎已解决。