是否可以堆叠jquery动画?

时间:2015-03-27 18:26:25

标签: jquery

类似于"如果首先要运行一个或多个效果,请等待时间执行",一次一个。

var stack = [];
stack.push( $(obj).fadeIn() );

我这是疯了吗? 提前谢谢。

2 个答案:

答案 0 :(得分:1)

  

如果首先要运行一个或多个效果,请等待时间执行

你所描述的被称为“排队”,而jQuery的.queue()方法就是它的实现方式。

动画已在内部使用.queue(),因此只需链接它们即可。

jQuery(function($) {
  $('div')
    .css('position', 'relative')
    .hide()
    .slideDown()
    .slideUp()
    .fadeIn()
    .fadeOut()
    .queue(function (next) {
      $(this).show();
      next();
    }).animate({
      top: 20,
      left: 50
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  this is an example
</div>

答案 1 :(得分:0)

你可以承诺这样的动画:

$('elem').promise().done({
    //call animation
});

或在另一个完成之后调用动画

$('elem').animate('opacity','1',function(){
    $(this).animate(stuff);
});