作者:cighao
来源:CSDN
原文:https://blog.csdn.net/cighao/article/details/49338903
<html>
<head>
<title>Banner Cycler</title>
<script>
var banners = ["1.jpg","2.jpg","3.jpg"]; // 图片地址
var counter = 0;
function run(){
setInterval(cycle,1000); //重复运行cycle函数,周期1000ms
}
function cycle(){
counter++;
if(counter == banners.length)
counter = 0;
document.getElementById("banner").src = banners[counter];
}
</script>
</head>
<body onload = "run();">
<img id="banner" alt="banner" src="1.jpg">
</body>
</html>
setInterval(cycle,1000);作用:每隔1s运行一次cycle函数
counter作用:控制图片下标,每当counter=3的时候,就让它为0
通过依次循环改变img的src属性实现图片的依次循环播放