javaScript 图片循环切换

最新推荐文章于 2019-08-06 09:23:20 发布

原创最新推荐文章于 2019-08-06 09:23:20 发布 · 893 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #div #function #layer

javaScript 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的轮播图片自动切换效果，包括变量定义、函数实现及定时器应用，使得图片能够自动循环展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<htnl><head>
<title></title>
<script language="javascript">
var pr1=1;//当前图片；
var max3=5;//当前图片；
function show(){
   var next=pr1+1;
   if(next==max3+1){
    pr1=max3;
    next=1;
   }
   {
   document.getElementById('div'+next).style.display="block";
   document.getElementById('div'+pr1).style.display="none";
   if(pr1==max3)
   pr1=1;
   else
   pr1 ++;
   }
  setTimeout("show()",2000);
}
</script>
</head>
<body onload="show()">
<div id="Layer1" style="position:absolute; left:119px; top:56px; width:565px; height:346px; z-index:1;">
<img src="images/1.jpg" width="297" height="352" id="div1"/>
<img src="images/2.jpg" width="297" height="352" id="div2"/>
<img src="images/3.jpg" width="297" height="352" id="div3"/>
<img src="images/4.jpg" width="297" height="352" id="div4"/>
<img src="images/5.jpg" width="297" height="352" id="div5"/>
</div>
</body>
</html>