Question

我正在尝试用jQuery做一些基本的动画。我希望淡入一些元素，但我想淡入，第二个元素，而第一个元素是中途完成，第三个元素，而第二个元素中途完成，等等。

我知道我可以这样做：

$('#element1).fadeIn(1000);
$('#element2).delay(500).fadeIn(1000);
$('#element3).delay(500).fadeIn(1000);
etc.

循环看起来更优雅但我的问题是，为什么以下代码不能像我期望的那样工作？

for (var i = 1; i <= 5; i++;) {
    $('#box' + i).fadeIn(2000).delay(500);
}

我希望每次循环迭代之间都会出现延迟，但所有动画都会同步发生。

我在哪里看到这个错误？

Answer 1

每个元素都有自己的特效队列。对于每个元素，必须有不同的延迟值：

for (var i = 0; i < 5; i++) {
    $('#box' + (i + 1)).delay(500 * i).fadeIn(1000);
}