倒计时结束后我可以自动更改图片来源吗?

时间:2017-07-24 23:44:12

标签: javascript image timer countdown

倒计时/定时器达到零后是否可以自动更改图像的来源?假设我有2个图像源 - A B ,还有一个计时器。当计时器到期时,如何将图像源从 A 更改为 B

<img class="image" src="A">
<div class="timer"></div>

计时器到期:

<img class="image" src="B">
<div class="timer">Expired</div>

1 个答案:

答案 0 :(得分:0)

您可以使用JavaSript的.src更改src。

以下是一个例子:

var changeSrc = function() {
  document.getElementById("image").src="http://via.placeholder.com/150x150";
}

var count=10;
var counter=setInterval(timer, 1000);

function timer() {
  count=count-1;
  if (count <= 0) {
     clearInterval(counter);
     changeSrc();
  }
  document.getElementById("timer").innerHTML = count;
}
<img id="image" src="http://via.placeholder.com/350x150">
<br>
<div>Timer: <span id="timer">10</span></div>