Question

我有一个jquery动画，其中包含大约300x个函数，因为这个函数作为一个序列依次播放：

$(".block").animate({"left": "+=50px"}, "slow");

1）如何通过点击一个锚来暂停整个事情并从再次点击（而不是从头开始）暂停的地方开始它？

2）另一方面，比方说我有这些：

$(".block").animate({"left": "+=50px"}, "slow");
$(".block").animate({"right": "+=50px"}, "slow");
$(".block").animate({"top": "+=50px"}, "slow");...(x100)

如何让它们一个接一个地播放而不将它们作为回调（我通过PHP生成它们，因为总共超过300个，因此很难将它们作为彼此的回调生成）？< / p>

Answer 1

要回答2），你可以像这样链接它们：

a = $(".block");
a = a.animate({"left": "+=50px"}, "slow");
a = a.animate(...)
etc...

示例：http://jsfiddle.net/NwXMT/3/

Answer 2

回答第一个问题。

$('#anchorTagId').click(function(){
    // Caching the current position of the animated element.
    var currentLeft = $('.block').css('left');
    // Then stop the animation on that element.
    $('.block').stop();
    // Setting anchor's tag to start
});

然后点击下一步

$('#anchorTagId').click(function(){
    if ($(this).hasClass('start') {
        // Starting the animation from the cached position;
        return;
    }
    // Code to stop the animation. 
});

JQUERY：如何暂停/开始动画？

2 个答案: