zoukankan      html  css  js  c++  java
  • <转>拖拽DIV最少代码

     
    <html>
    <title></title>
      <script type="text/javascript">
            function Drag(obj)
            {
                var obj = document.getElementById(obj);
                obj.style.position = "absolute";
                obj.onmousedown = function(e)
                {
                    e = e || window.event;
                    var x = e.offsetX;
                    var y = e.offsetY;
                    document.onmousemove = function(e)
                    {
                        e = e || window.event;
                        obj.style.left = (e.clientX - x) + "px";
                        obj.style.top = (e.clientY - y) + "px";
                    }
                    document.onmouseup = function()
                    {
                        document.onmousemove = null;
                        obj.onmousedown = null;
                    }
                }
            }
        </script>
    </head>
    <body>
        <div id="div"  style="background-color:White;300px;height:250px;">
         <div id="p" style="cursor:move;background-color:Red;300px;height:25px;" onmousedown="Drag('div')">        
         </div>
         <div>
         正文  
         </div>
        </div>
    </body>
    </html>
  • 相关阅读:
    HTML5 文件上传
    Vue-Router模式、钩子
    网络基础协议随笔
    Vue-Router基础使用
    vue中mixin的一点理解
    纯css3跑马灯demo
    Charles使用笔记
    提个醒。。。
    本机未装Oracle数据库时Navicat for Oracle 报错:Cannot create oci environment 原因分析及解决方案
    easyUI datagrid 清空
  • 原文地址:https://www.cnblogs.com/sunny0515/p/2757143.html
Copyright © 2011-2022 走看看