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

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()函数在延迟后添加动画，以便在延迟后执行它们，即使它们不在队列中

Updated fiddle