延迟的奇怪行为？

Question

在下面的代码中，页面会淡入，然后它会在左侧的列表项中淡入，然后它会在右侧的每个缩略图中淡入。但由于我使用.delay（），它最终会跳过部分或全部缩略图的加载。除了.delay（）之外，还有别的东西可以用来在开始之前暂停大拇指的执行吗？

//Showcase 
    $('#showcase').animate({'opacity' : 0}, 0); 
    fadeInDivs(['#showcase']); 
    function fadeInDivs(els) { 
     e = els.pop(); 
     $(e). delay(750).animate({'opacity' : 1}, 1000, function(){ 
      if (els.length) fadeInDivs(els); 
     }); 
    }; 

    $('#showcase').queue(function(){ 

     //fade in each filter 
     $('#filters li').each(function(i, item) { 
      setTimeout(function() { $(item).animate({'opacity' : 1}, 1000); }, 50 * i); 
     }); 

     //fade in each thumbnail 
     $('.thumb').delay(1000).each(function(i, item) { 
      setTimeout(function() { $(item).animate({'opacity' : 1}, 1000); }, 500 * i); 
     }); 
    }); 

Answer 1

试试这个fiddle。我想这是你在找什么。让我知道如果它不是。这里是jQuery代码：

$('#showcase').queue(function() { 
    var i = 0; 
    var length = $('#filters li').length; 
    //fade in each filter 
    $('#filters li').each(function(i) { 

     //alert(i); 
     $(this).delay(750*i).animate({ 
      'opacity': 1 
     }, 1000, function() { 
      if (i == length) { 
       //fade in each thumbnail 
       $('.thumb').each(function(i) { 
        $(this).delay(750 * i).animate({ 
         'opacity': 1 
        }, 1000); 
       }); 
      } 
     }); 
     i++; 
    }); 

});