javascript - Javascript 两个区间的图像变化

Question

我有一个图像，我想在屏幕上停留 5 秒钟，然后在 0.5 秒内更改为另一个图像，然后再变回原始图像。

我已将间隔设置为每 5 秒更改一次，但我似乎无法弄清楚如何让它在相应的时间更改。

任何帮助或指导将不胜感激！

window.setInterval(function() {

  var img = document.getElementById("glitch");
  img.src = "2-01.svg";

}, 5000);

标签： javascripthtml

Answer 1

试试这个：

const images = ["1.svg", "2.svg"]
var element = document.getElementById("glitch");

function showFirst() {
  setTimeout(() => {
    element.src = images[0];
    showSecond()
  }, 5000)
}

function showSecond() {
  setTimeout(() => {
    element.src = images[1];
    showFirst()
  }, 500)
}

showFirst()