zoukankan      html  css  js  c++  java
  • 无缝链接轮播图

     <style>
    * {
    margin: 0;
    padding: 0;
    }

    ul {
    list-style: none;

    }

    img {
    vertical-align: top;
    }

    /*取消图片底部3像素距离*/
    .box {
    300px;
    height: 200px;
    margin: 100px auto;
    background-color: pink;
    border: 1px solid red;
    position: relative;
    overflow: hidden;
    }

    .box ul li {
    float: left;
    }

    .box ul {
    1500px;
    position: absolute;
    left: 0;
    top: 0;
    }
    </style>
    </head>
    <body>
    <div class="box" id="screen">
    <ul>
    <li><img src="imgs/01(1).jpg" alt=""/></li>
    <li><img src="imgs/02(2).jpg" alt=""/></li>
    <li><img src="imgs/03(3).jpg" alt=""/></li>
    <li><img src="imgs/04(4).jpg" alt=""/></li>
    <li><img src="imgs/01(1).jpg" alt=""/></li>
    </ul>
    </div>
    <script src="../DOM/commer.js"></script>
    <script>
    var current = 0;//只声明了一次
    function f1() {
    var ulObj = ver("screen").children[0];
    current -= 10;
    if (current < -1200) {
    ulObj.style.left = 0 + "px";
    current = 0;
    } else {
    ulObj.style.left = current + "px";
    }
    }
    var timeId=setInterval(f1, 20);
    ver("screen").onmouseover=function () {
    //停止
    clearInterval(timeId);
    };
    ver("screen").onmouseout=function () {
    //继续
    timeId=setInterval(f1, 20);
    };
    </script>
  • 相关阅读:
    html04
    html03
    html02
    html01
    通过脚本获取form表单的数值而不是submit
    myeclipse自带的数据库查看文件
    如何实现数组和List之间的转换?
    Array和ArrayList有何区别?
    ArrayList和LinkedList的区别是什么?
    如何决定使用HashMap还是TreeMap?
  • 原文地址:https://www.cnblogs.com/lujieting/p/10055167.html
Copyright © 2011-2022 走看看