加載div然後延遲加載下jquery

嗨我有一個畫廊已離開浮動divs，圖片是每個div的背景，我想要的是每個圖片加載一個輕微的延遲，所以首先會加載然後等待5秒，然後第二個等序列中，我已經看到它的網站，但一直忘記書籤，如果可能的話，在jQuery中。加載div然後延遲加載下jquery

我也嘗試查詢，但我只能得到一大堆淡入時，我希望每個格在

淡出，以便使用此代碼：

<div id="parent"> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
    <div class="child"></div> 
</div>

子元素將在一個在淡出一次。先是5秒後再下一個等等。

感謝

來源

2011-07-31 graham

您可以使用

$('#parent .child') 
    .hide() 
    .each(function(index){ 
     var _this = this; 
     setTimeout(function(){ $(_this).fadeIn(); }, 5000*index); 
    });

演示在http://jsfiddle.net/gaby/eGWx9/1/

來源

2011-07-31 22:32:53

這是jQuery中效果很好的例子，雖然似乎隱藏它不顯示下一個之前的最後一個圖像？除非我錯了 –

@Decad，OP沒有要求任何隱藏..只是顯示每個之間的延遲.. –

我想我應該學會閱讀。謝謝=] –

首先你的孩子設置爲隱藏.child {display:none;}

然後淡出他們在遞歸：

function fade_in(e){ 
    $(e).fadeIn('slow',function(){ 
     if($(e).next().length > 0){ 
      setTimeout(function(){fade_in($(e).next());},5000); 
     } 
    }); 
} 
fade_in($('.child:first-child'));

http://jsfiddle.net/B7Qgk/1/

來源

2011-07-31 22:33:56 Maverick

jQuery.delay()

例如：

<script> 
    $("button").click(function() { 
     $("div.first").slideUp(300).delay(800).fadeIn(400); 
     $("div.second").slideUp(300).fadeIn(400); 
    }); 
</script>

來源

2011-07-31 22:41:51 Mattis

我喜歡@Gaby又名G. Petrioli回答最好，但生病後我的反正。

Live Demo

CSS

.child{display:none;}

showElements($('#parent')); 

function showElements(element){ 
    element.children('div').each(function(){ 
     if($(this).is(':hidden')){ 
      $(this).fadeIn(); 
      setTimeout(function(){showElements(element)}, 1000); 
      return false; 
     } 
    }); 
}

來源

2011-07-31 22:42:07 Loktar

加載div然後延遲加載下jquery

回答

相關問題