Question

在我们当前的项目中，我们使用jquery部署了各种对象的动画。任何人都可以建议一种方法来暂停和恢复动画。

我们听说过队列但是无法正常暂停和恢复。请建议如何使用队列暂停动画。请注意我们有多个对象，我们需要在点击按钮时暂停所有动画并在此后恢复点击另一个按钮。

如果有人能证明或提供一个例子，那将是一种感觉。（暂停插件不起作用，因为我们的动画之间有一些延迟功能）

Answer 1

可以使用stop()功能轻松完成。

<强>代码：

// to animate or continue animation
$('#item').animate({width: '500px'}, 2000);

// to pause the animation
$('#item').stop();

Answer 2

您可以使用jQuery animate()和stop()来开始和暂停动画，

animate - http://api.jquery.com/animate/

stop - http://api.jquery.com/stop/

在这里查看jQuery Demo， http://jsfiddle.net/muthkum/KP74n/

Answer 3

function animateLoop( $elem ){
    var i = $elem.data("i");
    var ti = 1 - i;
    var startPos = ( 2 * ti * contentWidth ) - contentWidth;
    $elem.css('margin-left', startPos + "px");
    $elem.animate( 
        { 
            'margin-left' :  - contentWidth + "px" },
        {
            duration: ( time * 1000 * ti ),
            easing: 'linear',
            step: function( v, p ){ 
                $elem.data( 'i', i + p.pos * ti ); 
                //console.log( i + p.pos * ti ); 
            },
            complete: function(){ 
                $elem.data( 'i', 0 ); 
                animateLoop( $elem ); 
            } 
        }
    );
};

$content.data('i',0);
animateLoop( $content );

关于如何停止和恢复jquery动画循环的建议。

使用jquery暂停和恢复动画

3 个答案: