美文网首页
可拖拽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

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