可以堆叠jquery动画吗？

Question

类似于“如果有一个或多个效果要先运行，等待执行”，一次一个。

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

我是不是疯了？提前谢谢。

Answer 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>

​

Answer 2

你可以像这样承诺动画：

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

或者在另一个动画完成后调用动画，如下所示

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