jquery - .animate() 后忽略 .delay()

Question

我有多个 div，它们应该彼此扩展。
每个div的展开动画都要延迟到前一个div的动画完成。这按预期工作。

在每一步的动画之后，我希望可以进一步延迟下一个 div 的动画。我的问题是，jQuery 完全忽略了动画后的延迟。after
调用有什么问题吗？.delay().animate()

这是我当前的代码：

$('div').each(function(index){
    $(this).delay(index*$stepspeed).animate({height: $stepheight[index]}, $stepspeed).delay((index+1)*$stepdelay+$startdelay);
});  

---

回答

我已经通过使用if跳过第一个中的延迟来解决它div。
这是我使用的代码：

$('div').each(function(index){
    if(index == 0) {$(this).delay($fadespeed).animate({height: $stepheight[index]}, $stepspeed);} //No delay for the first div
    else {$(this).delay($fadespeed+index*$stepspeed+(index+1)*$stepdelay+$startdelay).animate({height: $stepheight[index]}, $stepspeed);}
});

Answer 1

也许有一个更简单的解决方案，但这是我的解决方案（小提琴）。

构建一个函数，该函数在一个类似循环的小超时后为每个 div 调用：

$(function() {
    var el = $('div');
    lp(0);
    function lp(count){
        $(el.get(count)).animate({height: '200px'}, {duration: 500, queue: true, complete: function() {
            setTimeout(function(){
                if(count != el.length-1)
                {
                    count++;
                    lp(count);
                }
            }, 500);
        }});
    }
});