每个函数内部都有JQuery queue / delay（）

Question

我希望这个函数能够延迟每个函数内的每个动画。那是一个接一个。目前他们都是一起来的。

$('.bounceholder ul:eq(' + bounceholder + ') li').each(function(){
            $(this).delay(1000).animate({left: bounceoffset, top:-8, opacity:0.6, leaveTransforms:true}, {duration:600, queue:true});
            bounceoffset += 160;
        });

Answer 1

传递给each的块/函数可以接受计数器/索引作为第一个参数：

$('.bounceholder ul:eq(' + bounceholder + ') li').each(function(i){
  delay = (i + 1) * 1000
  $(this).delay(delay).animate({left: bounceoffset, top:-8, opacity:0.6, leaveTransforms:true}, {duration:600, queue:true});
  bounceoffset += 160;
});

Answer 2

function DoAnimation(items, delay, bounceOffSet) {
    $(items[0]).animate({left: bounceoffset, top:-8, opacity:0.6, leaveTransforms:true}, {duration:600, queue:true})
        .delay(delay)
        .promise()
        .done(function() {
            items.splice(0, 1);
            if (items.length > 0)
            {
                DoAnimation(items, delay, bounceOffSet + 160);    
            }            
    });       
}

var items = $('.bounceholder ul:eq(' + bounceholder + ') li');

DoAnimation(items, 1000, 0);