圖片依序顯示

by fu06h96z8

HTML

<div id="paracht">
    <p>文章段落一</p> 
    <p>文章段落二</p> 
    <p>文章段落三</p> 
    <p>文章段落四</p> 
    <p>文章段落五</p> 
    <p>文章段落六</p> 
    <p>文章段落七</p> 
    <p>文章段落八</p> 
</div>
<button id="parachtshow" type="button">show paragraphs in sequence...</button>

JavaScript

var fadeinTime = 300;
$('#paracht p').hide();

$('#parachtshow').click(function() {
    $('#paracht p').first().stop(true, true).fadeToggle(fadeinTime, function() {
        $(this).next().stop(true, true).fadeToggle(fadeinTime, arguments.callee);
    });
});