延遲的奇怪行爲？

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++; 
    }); 

});