zoukankan      html  css  js  c++  java
  • 鼠标跟随

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <style>
            div{
                height: 5px;
                width: 5px;
                background: red;
                position: absolute;
    
            }
        </style>
        <script>
            function getPos (ev)
            {
                var scrollTop = document.documentElement.srollTop||document.body.scrollTop;
                var scrollLeft = document.documentElement.scrollLeft||document.body.scrollLeft;
                return{x:ev.clientX+scrollLeft+'px',y:ev.clientY+scrollTop+'px'}
    
            }
            document.onmousemove = function (ev){
                var oDiv = document.getElementsByTagName('div');
                var oEvent = ev||event;
    
                for(var i=oDiv.length-1;i>0;i--)
                {
                    oDiv[i].style.left = oDiv[i-1].offsetLeft+'px';
                    oDiv[i].style.top = oDiv[i-1].offsetTop+'px';
                }
                oDiv[0].style.left = getPos(oEvent).x;
                oDiv[0].style.top = getPos(oEvent).y;
            };
    
        </script>
    </head>
    <body>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    </body>
    </html>

    有点小疑问,不知道oDiv[0]为什么放在for循环前后都没有问题。求指导!!

  • 相关阅读:
    vsftp
    数据类型
    第三篇:表相关操作
    第二篇:库相关操作
    第一篇: 初识数据库
    五 python并发编程之IO模型
    四 python并发编程之协程
    Python GIL
    三 python并发编程之多线程-重点
    三 python并发编程之多线程-理论
  • 原文地址:https://www.cnblogs.com/zhuni/p/4785930.html
Copyright © 2011-2022 走看看