帶有動畫/延遲的陣列輸出

Question

我有一個需要數組的函數。該數組應在循環內打印出來（帶動畫）。每個值一次應用於下面的div。首先它是空的。然後，數組中的第一個數值淡入，顯示幾秒鐘，最後淡出。數組中的所有值都應該像這樣對待。而div一次只顯示一個值。

<div id="text_wrapper"></div> 

功能：

function runAni(arr){ 
    $.each(arr, function(key, value) { 
     //alert(key + ': ' + value); 
    }); 
} 

我已經嘗試過的隊列，但未能成功。請幫助:)

Answer 1

function runAni(arr) { 
    var $div = $('#text_wrapper'); 

    $.each(arr, function(index, value) { 
     setTimeout(function() { 
      $div.html(value).fadeIn().fadeOut(); 
     }, 1000 * index); 
    }); 
} 

var arr = ["foo", "more foo", "Even more of that"]; 
runAni(arr);​ 

Live DEMO