如果用getJSON添加div，是否可以一次顯示動畫一個？

嘿大家。我通過getJSON函數附加了一些div，但我想稍微爵士一下。現在所有的div都在同時顯示。可以毫秒顯示它們嗎？像第一個淡入，然後是第二個，依此類推？如果用getJSON添加div，是否可以一次顯示動畫一個？

這就是我現在所擁有的，例如：

$.each(result, function(i, field){ 
    $(".thumbnail_area").append( 
    "<div class='thumb_container'>....</div>" 
    ).children().css('background-color', 'red').delay(1000).fadeOut(1000); 
    });// of result function 
});// of foreach function

截至目前，一切一秒鐘後淡出。（順便說一句哦，我知道我說我想他們淡入，但我只是用淡出BC其更容易測試的效果）

謝謝你們

來源

2011-03-27 NickG77

使用已經在循環獲得的指數值（ i）以產生隨着每次迭代而增加的延遲。

$.each(result, function(i, field){ 
    $(".thumbnail_area").append( 
    "<div class='thumb_container'>....</div>" 
    ).children().css('background-color', 'red').delay(1000 * i).fadeIn(1000); 
    });// of result function 
});// of foreach function

每個項目將被推遲i * 1000毫秒，所以他們會在1000毫秒彼此分開褪色。

來源

2011-03-27 19:00:03

THANK YOU SO MUCH傢伙！這完全奏效！ – NickG77 2011-03-27 19:14:11

您需要在函數中將延遲乘以i。

$.each(result, function(i, field){ 
    $(".thumbnail_area").append( 
    "<div class='thumb_container'>....</div>" 
    ).children().css('background-color', 'red').delay(1000*i).fadeOut(1000); 
    });// of result function 
});// of foreach function

檢查工作的例子，我之前做過一個simiar問題http://jsfiddle.net/Xc6jn/3/

來源

2011-03-27 19:00:15 Hussein

或者，你可以做一些像（100 * i-100）這樣的事情，因此每個div在* 100毫秒之後都會消失*，並且在返回通話之後不會有任何延遲。（除非我從0開始，那麼就忽略我） – Ben 2011-03-27 19:02:58

例子：

setInterval(function() { 
    $('<div>').html('Hello!').addClass('blah').hide().appendTo('#container') 
    .fadeIn(2000); 
}, 2000);

在看看：http://jsfiddle.net/QpWLs/1/

來源

2011-03-27 19:05:44

如果用getJSON添加div，是否可以一次顯示動畫一個？

回答

相關問題