如何使用jQuery使用幻燈片效果將div的內容從舊數據更改爲新數據？

Question

比方說，我有一個div A，我有文本數據的陣列。

在t = 0，DIV A將顯示$data[0]。每n秒後，我想在div顯示陣列中的下一個可用的記錄。

我想創建一個類似this slideshow effect的過渡效果。在這個過渡效果，用戶應該能夠看到$data[n]緩慢地從股利底部的中心滑動，而$data[n+1]放緩從頂部到div的中心滑動。

是否有可能做到這一點使用jQuery？

Answer 1

你可以試試這個：

<div id="container"> 
    <div class="inner">click me</div> 
    <div class="inner">im a text</div> 

</div> 

$("#container").on("click",function() { 
    $("#container").animate({ 
     top: "-=100%", 

    }, 1000, function() { 
    // Animation complete. 
    }); 
}); 

這裏是一個fiddle