javascript - Jquery - 动画 innerHTML 可能吗？

Question

我正在尝试使用一个执行 setTimeout 的函数，然后更改 innerHTML:

<script type="text/javascript">
    $(document).ready(function(){
        setTimeout(function(){
            document.getElementById("middlecolor").innerHTML='new text new text';
        }, 1000);
    });
</script>

问题:如何为出现的新文本添加动画效果，即逐行显示而不是一次全部写入？

感谢您的任何建议!

Answer 1

尝试这样的事情:

<div id="text">
</div>

$(document).ready(function () {
    var interval = setInterval(function () {
        $('#text').append('<p style="display: none;">new text</p>');
        $('#text p:last').fadeIn('slow');
    }, 5000);
});

参见示例 here

如果你想杀死间隔，可以这样做:

clearInterval(interval);

致谢。