zoukankan      html  css  js  c++  java
  • js实现简单图片轮播

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>图片轮播</title>
        <style>
            .wrapper {
                margin: 0;
                padding: 0;
            }
    
            img {
                width: 100%;
                height: auto;
            }
    
            ul {
                position: relative;
            }
    
            li {
                position: absolute;
                width: 500px;
                list-style: none;
            }
        </style>
    </head>
    
    <body>
        <div class="wrapper">
            <ul>
                <li><img src="img/1.png"></li>
            </ul>
        </div>
        <script>
            var img = ['1.png', '2.png', '3.png'];  
            var i = 0;  
            var t;      
            function change() {
                clearInterval(t);
                if (i > img.length - 1) {
                    i = 0;
                }
                document.images[0].src = 'img/' + img[i];
                console.log(document.images.length)
                i++;
                t = setInterval('change()', 1000);
            }
            change();
        </script>
    </body>
    
    </html>
  • 相关阅读:
    gdb php
    redis启动过程
    php protobuf 安装使用2
    php protobuf 安装使用
    服务治理
    base64编码
    redis-quicklist
    redis-ziplist
    redis-zset数据结构探索
    su root 出现 su: Authentication failure
  • 原文地址:https://www.cnblogs.com/kymming/p/5840985.html
Copyright © 2011-2022 走看看