<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
div {
width: 200px;
height: 200px;
border: 1px solid black;
}
</style>
<script src="jquery-3.6.0.js"></script>
<script>
$(function() {
//flat控制是否能够拖拽元素 x,y固定鼠标按下那一瞬间时的相对位置
var flat = false,
x, y;
$("div").mousedown(function(event) {
//设置true代表可以开始拖拽了
flat = true;
//固定住，偏移量
y = event.offsetY;
x = event.offsetX;
})
$("div").mousemove(function(event) {
if (flat) {
//设置top和left的值,使用鼠标在整个窗口中的坐标点减去偏移量
$(this).offset({
"top": (event.pageY - y),
"left": (event.pageX - x)
})
}
})
$("div").mouseup(function(event) {
//flat设置为false，不让再拖拽
flat = false;
})
})
</script>
</head>
<body>
<div></div>
</body>
</html>
405
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
