HTML 图片轮播

最新推荐文章于 2024-07-21 19:19:20 发布

对太阳心动

最新推荐文章于 2024-07-21 19:19:20 发布

阅读量3.1k

点赞数 2

文章标签： html linq webview

本文链接：https://blog.csdn.net/weixin_62026595/article/details/123387483

版权

这是一个使用HTML和JavaScript实现的图片轮播效果。通过设置显示的第一张图片、总图片数以及定时器，实现了每3秒自动切换显示下一张图片的功能。当到达最后一张图片时，会从第一张图片开始轮播。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title>图片轮播效果</title>
       <script type="text/javascript">
       var NowFrame = 1; //设置显示的第一个图片
       var MaxFrame = 4; //设置显示图片的个数
       function show() {
           for(var i=1;i<=MaxFrame;i++){
               if(NowFrame==i)
                   document.getElementById("adv"+NowFrame).style.display='block'; //当前显示图片
               else
                   document.getElementById("adv"+i).style.display='none';
               }
           if(NowFrame == MaxFrame) //判断当前图片是否是最后一个，如果是则从第一个重新轮回显示
           NowFrame = 1;
           else
               NowFrame++;   //设置下一个显示的图片