其他分享
首页 > 其他分享> > js-鼠标拖拽事件

js-鼠标拖拽事件

作者:互联网

//获取盒子
var div = document.querySelector("div");
//给div盒子添加鼠标按下事件
div.onmousedown = function (e) {
e = e || window.event;
var currentX = e.offsetX;
var currentY = e.offsetY;
//给div盒子添加鼠标移动事件
document.onmousemove = function (e) {
e = e || window.event;
var targetX = e.pageX - currentX;
var targetY = e.pageY -currentY;

            div.style.left = targetX + "px";
            div.style.top = targetY + "px";
        }
        document.onmouseup = function(e){
            document.onmouseup = document.onmousemove = false;
        }
    }

首先获取盒子的位置,用 var div = document.querySelector("div");
给div添加鼠标按下事件,用div.onmousedown = function(e){

}

标签:function,盒子,鼠标,js,var,div,document,拖拽
来源: https://www.cnblogs.com/lx1943661721/p/16357275.html