javascript - 不透明度动画应该容易吗？ (javascript)

好的，所以在这里学习此javascript时，我想创建一个
在我的HTML面板中，当单击按钮时，该div中的任何内容都是
逐渐淡出，新内容逐渐淡入……例如……一个jQuery画廊。

但是自从我学习以来，我想自己做。

也就是说，我正在尝试为虚拟div的不透明度设置动画，如下所示:

var daBox = document.getElementById("box");
var hmm;

function beginAnimBox (){
    daBox.style.opacity = 1;
    hmm = setInterval(animBox,5000);

}

function animBox(){
    if(daBox.style.opacity == "1"){
        daBox.style.opacity = -0.1;

    }
}


window.onload = function(){
    beginAnimBox();
}

像这样的例子。
逻辑上(如果有意义的话，则为不知道)是每x秒执行一次代码以将不透明度值减小.1到0。

然后，当完全不透明时，我会稍后编写一些内容以引入新内容。

任何想法，技巧，链接等。

最佳答案

function animBox(){
    if(daBox.style.opacity == 0){
        clearInterval();
    } else {
      daBox.style.opacity -= 0.1;
    }
}

不是JS忍者，但可能会成功。