jquery - 如何将两个不同的动画应用于具有不同持续时间的同一元素？

Question

我已经找到了使用{queue: true}的解决方案，但问题是这似乎不适用于我的情况。

我创建了一个小提琴来帮助您理解我的问题：http: //jsfiddle.net/c6SS9/1/。

jQuery代码：

$(function() {
    for(var i=0; i < $('.block').size(); i++) {
        $('.block').eq(i).delay(i*200).animate({'left': '300px'}, 700);
        $('.block').eq(i).delay(i*200).animate({'opacity': '1'}, {queue: false, duration: 1000});
    }
});​

我想要的是用于不透明度的动画在块开始移动时开始，并且每个块都必须发生这种情况。

Answer 1

我想你明白问题在于opacity动画绕过延迟，因为它不在队列中。

在这种情况下，使用泛型.queue()函数在延迟之后添加动画，这样即使它们不在队列中，它们也会在延迟之后执行

更新的小提琴