從上到下淡入頁面元素

Question

從上到下淡化頁面元素有什麼好的資源？

我有一個Magento項目，其中有幾個flexsliders和一些其他靜態元素，我有興趣試圖在加載時從上到下淡入不同的元素行。目前靜態元素加載，然後flexslider加載最後，使頁面加載不雅。

有沒有人有一些建議的插件或類似的資源，我可以調查？我將對一些靜態圖像使用延遲加載，但這並不能解決垂直加載問題。最好基於jquery，如果不是javascript直的。

Answer 1

如果你想這樣做褪色的第一行，然後下一行，然後下一行，依此類推，你可以使用自定義隊列：

// Set up your queue of fadeIns: 
$(row_selectors).each(function() { 
    $(this).queue(
     'fade_in_tans', 
     function() { 
      $(this).fadeIn().delay(delay_in_ms_if_desired).dequeue('fade_in_trans'); 
     } 
    ); 
}); 
// now initiate the first fadeIn: 
$(first_row_selector).dequeue('fade_in_tans');