使用jquery暂停和恢复动画

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

我们听说过队列，但无法做适当的暂停和恢复。请建议如何使用队列暂停动画。请注意，我们有多个对象，我们需要暂停按钮上的所有动画并单击此后再点击一次按钮。

如果任何人都可以演示或提供示例，这将是你的一种。（暂停插件没有工作，因为我们有一些延迟功能，在我们的动画之间）

来源

2012-10-23 Ronny

删除了推荐文字。召回非现场资源是[脱离SO主题]（http://stackoverflow.com/help/dont-ask） – Liam

您可以使用jQuery animate()和stop()待办事项开始和暂停动画，

animate -

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

退房jQuery的演示在这里， http://jsfiddle.net/muthkum/KP74n/

来源

2012-10-23 10:41:35

可以使用stop()函数轻松完成。

演示：http://jsfiddle.net/6eMQq/

代码：

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

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

来源

2012-10-23 10:45:16 techfoobar

我们有多个对象及其相应的动画。请提供一个例子，一次暂停，然后继续 – Ronny

检查此示例：http://jsfiddle.net/6eMQq/1/ - 它使用'：animated'选择器来识别被动画的对象。 – techfoobar

我们不能在重新开始时重写代码或提供函数。我们还需要多个对象具有需要暂停和恢复的独特动画。 – Ronny

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的动画循环的建议。

来源

2016-11-14 23:03:42

使用jquery暂停和恢复动画

回答

相关问题