DIV拖拽
1 window.onload = function() {
2 var oDiv = document.getElementById("div1");
3 var disX = 0;
4 var disY = 0;
5
6 oDiv.onmousedown = function(ev) {
7 var oEvent = ev || event;
8
9 //记录鼠标相对DIV的距离
10 disX = oEvent.clientX - oDiv.offsetLeft;
11 disY = oEvent.clientY - oDiv.offsetTop;
12
13 document.onmousemove = function(ev) {
14 var oEvent = ev || event;
15 var l = oEvent.clientX - disX;
16 var t = oEvent.clientY - disY;
17
18 //防止DIV移除到浏览器外面
19 if (l < 0) {
20 l = 0;
21 } else if (l > document.documentElement.clientWidth - oDiv.offsetWidth) {
22 l = document.documentElement.clientWidth - oDiv.offsetWidth;
23 }
24
25 if (t < 0) {
26 t = 0;
27 } else if (t > document.documentElement.clientHeight - oDiv.offsetHeight) {
28 t = document.documentElement.clientHeight - oDiv.offsetHeight;
29 }
30
31 oDiv.style.left = l + "px";
32 oDiv.style.top = t + "px";
33 }
34
35 document.onmouseup = function() {
36 document.onmousemove = null;
37 document.onmouseup = null;
38 }
39
40 //兼容FF
41 return false;
42 };
43 };