javascript - 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 属性)。其余内容应位于这两个元素之上，并具有透明背景。