zoukankan      html  css  js  c++  java
  • 不可点击的轮播图

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style type="text/css">
    /*overflow:hidden的作用是隐藏溢出,超出设置的宽高后自动隐藏*/
    #tab { overflow:hidden; position:relative; float:left;}
    /*img里面的第一个元素外的元素都设置为*/
    #tab>img:not(:first-child){ display:none; }
     
    </style>
    <script>
        window.onload = function(){
         
            var images = document.getElementsByTagName('img');
            console.log(images)
            var pos = 0;
            var len = images.length;
             
            setInterval(function(){
             
                images[pos].style.display = 'none';
                pos = ++pos == len ? 0 : pos;
                images[pos].style.display = 'inline';
             
            },1000);
             
        };
    </script>
     
    </head>
     
    <body>
    <div id="tab">
        <img src="./img/1.jpg" />
        <img src="./img/2.jpg" />
        <img src="./img/3.jpg" />
    </div>
    </body>
    </html>

  • 相关阅读:
    lombok的介绍及使用
    java后端导入excel将数据写入数据库
    java后端导出excel表格
    eclipse maven打war包
    java后端树形菜单使用递归方法
    mybatis一对多查询
    @transactional作用和事务
    zookeeper安装
    Solr单机版安装
    jstat 简介(2)
  • 原文地址:https://www.cnblogs.com/zouyun/p/7130457.html
Copyright © 2011-2022 走看看