2016-04-07 JavaScript-自动滚动图片

简介:JavaScript实现自动滚动的图片,关键在于如何运用setInterval() 方法

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>2016-04-07 JavaScript-滚动图片</title>
  <script language="javascript" type="text/javascript">
  var i=0;
  var img=new Array();
  img[0]="1.jpg";
  img[1]="2.jpg";
  img[2]="3.jpg";
  //setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。
  setInterval("gun()",2000);
  function gun(){
   if(i==img.length-1){
    i=0;
   }else{
       i+=1;
   }
   document.getElementById("image").src=img[i];
  }
  </script>
 </head>
 <body>
  <div width="600px"height="300px" style="margin:0 auto"><img id="image" src="1.jpg" width="600px"height="300px"></div>
 </body>
</html>

posted @ 2016-04-07 16:48  小兵程序猿  阅读(137)  评论(0编辑  收藏  举报