<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#main div {
position: absolute;
width: 220px;
height: 150px;
border: 1px solid #999;
}
</style>
<script type="text/javascript">
var a;
document.onmouseup = function () {
if (!a)return;
document.all ? a.releaseCapture() : window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
a = "";
};
document.onmousemove = function (d) {
if (!a)return;
if (!d)d = event;
a.style.left = (d.clientX - b) + "px";
a.style.top = (d.clientY - c) + "px";
};
function $(o, e) {
a = o;
// console.log(a.setCapture)
b = e.clientX - parseInt(a.style.left);
c = e.clientY - parseInt(a.style.top);
document.all ? a.setCapture() : window.captureEvents(Event.MOUSEMOVE);
}
</script>
</head>
<body>
<div id="main">
<div style="left:100px;top:100px;background:#fc9;" onmousedown="$(this,event)">1</div>
<!--<div style="left:400px;top:100px;background:#9cf;" onmousedown="$(this,event)">2</div>-->
<!--<div style="left:700px;top:100px;background:#f9c;" onmousedown="$(this,event)">3</div>-->
<!--<div style="left:100px;top:300px;background:#9fc;" onmousedown="$(this,event)">4</div>-->
<!--<div style="left:400px;top:300px;background:#c9f;" onmousedown="$(this,event)">5</div>-->
<!--<div style="left:700px;top:300px;background:#cf9;" onmousedown="$(this,event)">6</div>-->
</div>
</body>
</html>
时间： 2024-10-24 01:25:28