簡單的圖片間隔指定時間切換效果

admin發表於2017-02-19
大家對焦點圖片切換功能自然不陌生，一般來說來，這些焦點圖功能都比較強大，並且帶有很多的特效。本章介紹的圖片能夠間隔指定時間就能夠自動切換的功能可以說是一個簡化版本的焦點圖效果，程式碼非常的簡單。

程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" /> 
<title>圖片自動跳轉</title> 
<script type="text/javascript"> 
setInterval(test,1000); 
var array=new Array(); 
var index=0; 
var array= new Array("1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg","7.jpg","8.jpg"); 
function test() {
  var myimg=document.getElementById("imgs"); 
  if(index==array.length-1) { 
   index=0; 
  }
  else{ 
    index++; 
  } 
  myimg.src=array[index]; 
} 
</script> 
</head> 
<body > 
<img id="imgs" src="1.jpg" /> 
</body> 
</html>

相關文章