javascript - 如何在不同时间创建Javascript标语切换图片？

我有一个横幅，上面有10张图片。我知道如何设置超时，以便图片每隔一定的秒数切换一次，但是我如何设置计时器以根据想要显示单个图片的时间来更改图片。

例如：
我希望picture1显示10秒，picture2显示3秒，picture3显示15秒。

到目前为止，这是我的代码：（以5秒的相等间隔更改所有图像。

Javascript：

        window.onload = rotate;
         var thisAd = 0;
         var adImages = new Array("Images1/Picture10","Images1/Picture1","Images1  /Picture2","Images1/Picture3","Images1/Picture4","Images1/Picture5","Images1/Picture6","Images1/Picture7","Images1/Picture8","Images1/Picture9");

function rotate(){
          thisAd++;
          if(thisAd == adImages.lengh){
            thisAd = 0;
          }
          document.getElementById("adBanner").src = adImages[thisAd];
          setTimeout(rotate, 5 * 1000);
}

最佳答案

您可以将图片存储到具有两个属性的对象中：一个用于URL，另一个用于延迟，然后使用它。

var adImages = [
    {
        url:"img1.png",
        delay: 5
    },
    {
        url:"img2.png",
        delay: 3
    }
];

然后，您可以使用这些属性：

var image = adImages[thisAd];
document.getElementById("adBanner").src = image.url;
setTimeout(rotate, image.delay * 1000);