我试图让这个文本在旧文本上淡出并在新文本上淡入

Question

我试图让文本淡出，但在新文本更改后又重新出现。我想知道我的代码中文本出现的地方可能有什么问题，然后淡出，然后以一种丑陋的方式返回……我该如何修改这段代码？谢谢。

查看我正在处理的网站

<script type="text/javascript">
var text = ['Sometimes you just have to destroy everything in order to build something brand new<span class="period">.</span>', 'So, we decided to destroy the old way of doing things, and completely redesign Revolt<span class="period">.</span>'];
var counter = 0;
var elem = document.getElementById("changeText");
setInterval(change, 8000);
$(elem).fadeIn();
function change(){
$(elem).fadeOut();
 elem.innerHTML= text[counter];
    counter++;
    if(counter >= text.length) { counter = 0; }
    $(elem).fadeIn();
}
</script>

Answer 1

将您的 change() 函数替换为：

function change(){
    $(elem).fadeOut(400, function() {
        elem.innerHTML = text[counter];
        counter++;
        if(counter >= text.length) { counter = 0; }
        $(elem).fadeIn();
    });
}

说明：fadeOut 函数returns 立即执行，而不是等待淡入淡出完成。您需要将回调传递给 fadeOut 以使您的更改等到淡入淡出实际完成。

我试图让这个文本在旧文本上淡出并在新文本上淡入

I'm trying to have this text fade out on the old text and fade in on the new text

html

javascript

jquery

fadein

web