jquery-ui - jQuery - 一个接一个地附加多个元素

Question

我希望在将多个段落附加到 div 时创建一个不错的效果。当我追加时，我想一次淡出一个段落，这样一个段落就会一个接着一个地显示。此时它们都同时淡入。

示例 html；

<div class="wrapper">
<p class="para">paragraph 1</p>
<p class="para">paragraph 2</p>
<p class="para">paragraph 3</p>
</div>

这是用于附加到 div 的代码

$(results).prependTo(".wrapper").hide().fadeIn('slow');

(结果)只是多个段落。

预先感谢您的帮助和建议。

Answer 1

你可以尝试这样的事情:

$(results).bind('appear', function(){ // bind a custom event
  $(this).fadeIn('slow', function(){
    $(this).next('p.para').trigger('appear'); // recurse
  });
})
.prependTo('wrapper')
.end() // back to "results"
.hide() // not necessary if already hidden by style rule
.first().trigger('appear'); // start the cascade

这是一个示例:http://jsfiddle.net/redler/CDbEn/