獲取外部HTML和淡入淡出/延遲檢索到的元素

Question

我想從外部源加載一些HTML，然後逐個淡入/加載它的一部分到當前頁面上。

外部HTML看起來像：

<div id="entries"> 
    <div class="entry">A</div> 
    <div class="entry">B</div> 
    <div class="entry">C</div> 
</div> 

而且我可以這樣做，讓每一個「入口」：

$.get('external.html', function(responseText) { 
    var $response = $(responseText); 
    var $entries = $response.find('div.entry'); 
    $entries.each(function(index, $entry) { 
    // TODO - fade in each entry every x seconds onto the main page  
    // $('#entries').html($entry.outerHTML); 
    }); 
}); 

我不能工作是如何延遲加載每個條目都會在主頁面上每隔x秒更改一次。

任何人都可以幫忙嗎？

謝謝！

Answer 1

你可以使用類似的東西：

var $entries = $(response).find('div.entry'); 
(function fadeInOut(i) { 
    var next = i < $entries.length - 1 ? i + 1 : 0; 
    $entries.delay(2000).fadeOut(500).eq(i).delay(500).fadeIn(1000, function() { 
     fadeInOut(next); 
    });  
}(1)); 

見DEMO