代码改变世界

用js实现banner图片轮换的方式

2017-02-09 11:06  写代码的渔夫  阅读(4886)  评论(0)    收藏  举报

<div id="banner_main">
<div id="banner">
       <script language =javascript >
var curIndex=0;
//时间间隔 单位毫秒
var timeInterval=3000;
var arr=new Array();
arr[0]="http://www.yixintongda.com/images/2009_12_13_73779_145010.jpg";
arr[1]="http://www.yixintongda.com/images/2009_12_13_81425_144916.jpg";
arr[2]="http://www.yixintongda.com/images/2010_3_3_90926_18248.jpg";

setInterval(changeImg,timeInterval);
function changeImg()
{
var obj=document.getElementById("showpic");
if (curIndex==arr.length-1)
{
curIndex=0;
}
else
{
curIndex+=1;
}
obj.src=arr[curIndex];
}
</script>
<img src="http://www.yixintongda.com/images/2009_12_13_73779_145010.jpg" width="970" height="280" id="showpic" />
</div>
</div>

 

 

后记:

通过这种方式,实现banner图片的轮换。

主要用到了js里的setInterval函数。