JS通用窗口拖动函数

cu_Cbear

JS通用窗口拖动函数
view sourceprint?

1. <PRE class=brush:javascript;gutter:false;>调用请使用: onmousedown='Move_obj("objId")'  objId: 表示你想拖动的窗口ID </PRE>
   
2. 
   
3. view sourceprint?<script language="JavaScript" type="text/javascript">  
   
4. 
   
5.     ////  
   
6. 
   
7.     // 点击拖动窗口- 调用请使用: onmousedown='Move_obj("objId")'  objId: 表示你想拖动的窗口ID  
   
8. 
   
9.     ////  
   
10. 
    
11.     var drag_=false;  
    
12. 
    
13.     //获取输入:ID, 获得objId对象  
    
14. 
    
15.     var D=new Function('obj','return document.getElementById(obj);');  
    
16. 
    
17.     var oevent=new Function('e','if (!e) e = window.event;return e');  
    
18. 
    
19.     var obj_move=false;  
    
20. 
    
21.     function Move_obj(obj){  
    
22. 
    
23.         var x,y;  
    
24. 
    
25.         obj_move=true;  
    
26. 
    
27.         //注册obj对象鼠标按下事件  
    
28. 
    
29.         D(obj).onmousedown=function(e){  
    
30. 
    
31.             //取消拖动  
    
32. 
    
33.             if(!obj_move)return false;  
    
34. 
    
35.             drag_=true;  
    
36. 
    
37.             //with(this): 为区域语句设定默认对象。style等价于 this.style  
    
38. 
    
39.             with(this){  
    
40. 
    
41.                 //obj对象offsetLeft距离左边距离 不包括marginLeft宽度, offsetTop同理  
    
42. 
    
43.                 style.position="absolute";var temp1=offsetLeft;var temp2=offsetTop;  
    
44. 
    
45.                 //clientX 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（或当前窗口）的水平坐标。  
    
46. 
    
47.                 x=oevent(e).clientX;y=oevent(e).clientY;  
    
48. 
    
49.                 document.onmousemove=function(e){  
    
50. 
    
51.                     //取消拖动  
    
52. 
    
53.                     if(!drag_)return false;  
    
54. 
    
55.                     with(this){  
    
56. 
    
57.                         //obj距离左边距离 + 外边距 + 鼠标移动距离  
    
58. 
    
59.                         style.left=temp1-Number(style.marginLeft.substring(0,style.marginLeft.length-2))+oevent(e).clientX-x+"px";  
    
60. 
    
61.                         style.top=temp2-Number(style.marginTop.substring(0,style.marginTop.length-2)) +oevent(e).clientY-y+"px";  
    
62. 
    
63.                     }  
    
64. 
    
65.                 }  
    
66. 
    
67.             }  
    
68. 
    
69.             document.onmouseup=new Function("drag_=false;obj_move=false;");  
    
70. 
    
71.         }  
    
72. 
    
73.     }  
    
74. 
    
75.     </script>
    

复制代码