前端学习笔记之拖拽
最近学习到Jquery部分,刚好在写拖拽的作业,于是就想把这一部分的作业分享出来和大家交流一下!
<body>
<div class="box">
</div>
<script src="../JQ/jquery(2)/jQurey/jQurey各版本/jquery-3.3.1.js"></script>
<script>
$(document).on("mousedown", "div", function (e) {
const { offsetX: x1, offsetY: y1 } = e;
$(document).on("mousemove", e => {
const { pageX: x2, pageY: y2 } = e;
$(this).css({
left: x2 - x1,
top: y2 - y1,
});
})
});
$(document).on("mouseup", function (e) {
$(document).off("mousemove");
})
</script>
</body>