一、在body里面新建一个div
<div class="box">
二、在css里面写上样式
PS:一定要写上定位position,因为offsetLeft、offsetTop计算的是当前元素的外边距到已经定位的父元素内边距的水平或者垂 直的距离。
<style> .box { height: 200px; width: 200px; border: 2px solid skyblue; position: absolute; left: 100px; top: 100px; } </style>
三、js代码如下
<script> //1.获取页面元素 var box = document.querySelector('.box'); //设置开关判断鼠标是在box否按下 var flag = false; //2.box绑定鼠标按下事件 var delX = 0; var delY = 0; box.onmousedown = function () { flag = true; //获取需要删除的距离 delX = event.clientX - box.offsetLeft; delY = event.clientY - box.offsetTop; }; //3.整个文档绑定鼠标移动事件 document.onmousemove = function () { if (flag) { //删除多余的距离 保持住按下的位置 var x =