Question

我正在尝试使图像在10秒后从一个图像变为另一个图像。我已经找到了下面的代码，但是它每10秒就在图像之间不断变化。

仅更改一次图像后如何停止？

<!DOCTYPE html>
<html>

<head>
  <title>Demo</title>
</head>

<body onload="startTime();"><img id="img1" />
  <script>
    var imgArray = new Array(" IMAGE1.gif", "IMAGE2.png");
    var imgCount = 0;

    function startTime() {
      if (imgCount == imgArray.length) {
        imgCount = 0;
      }
      document.getElementById("img1").src = imgArray[imgCount];
      imgCount++;
      setTimeout("startTime()", 10000);
    }
  </script>
</body>

</html>

如果您可以帮助我或知道代码，请帮助我。

Answer 1

您可以一次调用更改图片功能：

setTimeout(function(){
    document.getElementById("img1").src = "IMAGE2.png";
}, 10000);

Working example here

或使用您的代码：

<!DOCTYPE html>
    <head>
        <title>Demo</title>
    </head>

    <body>
        <img id="img1" src="IMAGE1.gif" />
        <script>
            setTimeout(function(){
                document.getElementById("img1").src = "IMAGE2.png";
            }, 10000);
        </script>
    </body>
</html>

如何在几秒钟后更改一次图像？

1 个答案: