美文网首页
可拖拽div

可拖拽div

作者: 诺诺诺诺Daddy | 来源:发表于2019-08-29 11:23 被阅读0次
      function dragFunc(id){
            var Drag = document.getElementById(id);
            console.log(Drag)
            Drag.onmousedown = function(event){//mousedown 事件。 与 click 事件不同,mousedown 事件仅需要按键被按下,而不需要松开即可发生
                console.log(event);
                var ev = event || window.event;
                event.stopPropagation();
                var disX = ev.clientX - Drag.offsetLeft;
                var disY = ev.clientY - Drag.offsetTop;
                document.onmousemove = function(event) {
                    var ev = event || window.event;
                    Drag.style.left = ev.clientX - disX + "px";
                    Drag.style.top = ev.clientY - disY + "px";
                    Drag.style.cursor = "move";
                };
            }
             Drag.onmouseup = function() {
                document.onmousemove = null;
                this.style.cursor = "default";
            };
        }
        dragFunc('box');

相关文章

  • 可拖拽div

    一个在移动端及PC端都可以使用的拖拽函数。 使用方法 需要先设置position属性,absolute relat...

  • 可拖拽div

  • 可拖拽的div

  • 事件应用

    拖拽 拖拽原理 三大事件 -鼠标和Div的相对距离不变 把拖拽加到document上 如果拖得太快,会移出div,...

  • 事件应用

    拖拽 拖拽原理 三大事件 -鼠标和Div的相对距离不变 把拖拽加到document上 如果拖得太快,会移出div,...

  • div 拖拽

    /* 图标功能加载*/pageCommon.nav = function () {var posX;var pos...

  • 拖拽div的值到table

    Html 代码 jQeruyUI拖拽效果_拖拽div的值到table表格...

  • js 拖拽 DIV

  • JS拖拽div

  • JavaScrip--事件应用

    事件应用 拖拽 拖拽原理 三大事件 -鼠标和Div的相对距离不变 把拖拽加到document上 如果拖得太快,会移...

网友评论

      本文标题:可拖拽div

      本文链接:https://www.haomeiwen.com/subject/khzbectx.html