zDrag.js 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. var Drag={
  2. "obj":null,
  3. "init":function(handle, dragBody, e){
  4. if (e == null) {
  5. handle.onmousedown=Drag.start;
  6. }
  7. handle.root = dragBody;
  8. if(isNaN(parseInt(handle.root.style.left)))handle.root.style.left="0px";
  9. if(isNaN(parseInt(handle.root.style.top)))handle.root.style.top="0px";
  10. handle.root.onDragStart=new Function();
  11. handle.root.onDragEnd=new Function();
  12. handle.root.onDrag=new Function();
  13. if (e !=null) {
  14. var handle=Drag.obj=handle;
  15. e=Drag.fixe(e);
  16. var top=parseInt(handle.root.style.top);
  17. var left=parseInt(handle.root.style.left);
  18. handle.root.onDragStart(left,top,e.pageX,e.pageY);
  19. handle.lastMouseX=e.pageX;
  20. handle.lastMouseY=e.pageY;
  21. document.onmousemove=Drag.drag;
  22. document.onmouseup=Drag.end;
  23. }
  24. },
  25. "start":function(e){
  26. var handle=Drag.obj=this;
  27. e=Drag.fixEvent(e);
  28. var top=parseInt(handle.root.style.top);
  29. var left=parseInt(handle.root.style.left);
  30. //alert(left)
  31. handle.root.onDragStart(left,top,e.pageX,e.pageY);
  32. handle.lastMouseX=e.pageX;
  33. handle.lastMouseY=e.pageY;
  34. document.onmousemove=Drag.drag;
  35. document.onmouseup=Drag.end;
  36. return false;
  37. },
  38. "drag":function(e){
  39. e=Drag.fixEvent(e);
  40. var handle=Drag.obj;
  41. var mouseY=e.pageY;
  42. var mouseX=e.pageX;
  43. var top=parseInt(handle.root.style.top);
  44. var left=parseInt(handle.root.style.left);
  45. if(document.all){Drag.obj.setCapture();}else{e.preventDefault();};//作用是将所有鼠标事件捕获到handle对象,对于firefox,以用preventDefault来取消事件的默认动作:
  46. var currentLeft,currentTop;
  47. currentLeft=left+mouseX-handle.lastMouseX;
  48. currentTop=top+(mouseY-handle.lastMouseY);
  49. handle.root.style.left=currentLeft +"px";
  50. handle.root.style.top=currentTop+"px";
  51. handle.lastMouseX=mouseX;
  52. handle.lastMouseY=mouseY;
  53. handle.root.onDrag(currentLeft,currentTop,e.pageX,e.pageY);
  54. return false;
  55. },
  56. "end":function(){
  57. if(document.all){Drag.obj.releaseCapture();};//取消所有鼠标事件捕获到handle对象
  58. document.onmousemove=null;
  59. document.onmouseup=null;
  60. Drag.obj.root.onDragEnd(parseInt(Drag.obj.root.style.left),parseInt(Drag.obj.root.style.top));
  61. Drag.obj=null;
  62. },
  63. "fixEvent":function(e){//格式化事件参数对象
  64. var sl = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
  65. var st = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
  66. if(typeof e=="undefined")e=window.event;
  67. if(typeof e.layerX=="undefined")e.layerX=e.offsetX;
  68. if(typeof e.layerY=="undefined")e.layerY=e.offsetY;
  69. if(typeof e.pageX == "undefined")e.pageX = e.clientX + sl - document.body.clientLeft;
  70. if(typeof e.pageY == "undefined")e.pageY = e.clientY + st - document.body.clientTop;
  71. return e;
  72. }
  73. };