zoukankan      html  css  js  c++  java
  • js之鼠标随动后面跟随事件(类似于长龙跟着跑)

    <!DOCTYPE html>
    <html lang="zh">
    <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>Document</title>
    </head>
    <style>
          div{width: 10px;height: 20px;background-color: red;position: absolute;}      
          
    </style>
    <body>         
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
              <div></div>          
             
    </body>
    
    <script type="text/javascript">
             function getPos(ev){
                 var scrollTop=document.documentElement.scrollTop || document.body.scrollTop;
                 var scrollLeft=document.documentElement.scrollLeft || document.body.scrollLeft;
                 return {x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop }
             }
             
                  document.onmousemove=function(ev){
                          var oDiv=document.getElementsByTagName('div');
                          var oEvent=ev || event;
                          var pos=getPos(oEvent);
                          
                          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=pos.x+'px';
                          oDiv[0].style.top=pos.y+'px';
                  }
            
    </script>
        
                
    
    </html>
  • 相关阅读:
    EL表达式(Expression Language)
    JSP简单功能介绍
    MySQL基础使用
    JDBC
    MySQL安装卸载
    stanfordnlp dependencies(依存关系简写表)
    不需要深度学习就能做的文本分类器
    词向量的cbow模型
    pytorch实现自己的textCNN
    OpenCV编译viz模块
  • 原文地址:https://www.cnblogs.com/kangshuai/p/7243855.html
Copyright © 2011-2022 走看看