JS流畅地交换图像

Question

我已经有了交换图像的功能，但它们没有动画就交换了。现在我想要一个功能女巫用褪色来交换图像。这是我为交换函数编写的代码：

var header = new Array();
header[0] = "images/lan/IMG_2799.jpg";
header[1] = "images/lan/IMG_2816.jpg";


var x = 0;

function swapHeader() {
    document.getElementById("header").style.backgroundImage = "url(" + header[x] + ")";
    if (x < header.length - 1) x++; else x = 0;
    setTimeout("swapHeader()", 5000);
}
window.onload=swapHeader;

Answer 1

您可能想要使用两个元素，每个图像一个。然后，慢慢增加和减少顶部的不透明度（CSS属性）。其余内容应高于这两个元素，并具有透明背景。