jquery - 随机动画单个字母

Question

我有一个单词，我使用 jquery 字母分隔成单个字母。

处理后的标记看起来像这样

<div id="tagline">
<p>
<span class="char1">w</span>
<span class="char2">e</span>
<span class="char3"> </span>
<span class="char4">c</span>
<span class="char5">o</span>
</p>
</div>

等等等等

所以我想知道如何让一个随机字母在每个设定的时间间隔内得到动画。

就像一秒钟后，也许'c'会淡出然后淡入，然后'w'会那样做等等

所有帮助表示赞赏！谢谢！！

Answer 1

要在设定的时间间隔内做某事，请使用，嗯，setInterval:)

要随机选择一个孩子，请使用Math.random：

var letters = tagline.children();

setInterval(function() {
     letters.eq(Math.random() * letters.length | 0).fadeOut(500).fadeIn(500); // Or something
}, 1000);

Answer 2

确保您的 span el 设置为 - opacity: 0;

$('#tagline span').each(function(index) {
    $(this).delay(200*index).animate({'opacity' : '1'}, 250);
});