简易而又灵活的Javascript拖拽框架.docVIP

简易而又灵活的Javascript拖拽框架简易而又灵活的Javascript拖拽框架（一） 最近在做js拖拽的时候，发现了一个强大而又灵活的拖拽框架，（之前用了代码混淆器，还好代码比较短，我就翻译过来了）利用这个框架不仅能实现简单的拖动，更能轻易的实现各种复杂的拖放功能。这一篇先实现最简单的拖拽，稍微复杂的拖放将在后面的文章里写出来。 二、代码 先把代码贴出来 Codevar?Drag={????obj:null,????init:function(handle,?dragBody,?e){????????if?(e?==?null)?{????????????handle.onmousedown=Drag.start;????????}????????handle.root?=?dragBody;????????????????if(isNaN(parseInt(handle.root.style.left)))handle.root.style.left=0px;????????if(isNaN(parseInt(handle.root.style.top)))handle.root.style.top=0px;//确保后来能够取得top值????????handle.root.onDragStart=new?Function();????????handle.root.onDragEnd=new?Function();????????handle.root.onDrag=new?Function();????????if?(e?!=null)?{????????????var?handle=Drag.obj=handle;????????????e=Drag.fixe(e);????????????var?top=parseInt(handle.root.style.top);????????????var?left=parseInt(handle.root.style.left);????????????handle.root.onDragStart(left,top,e.pageX,e.pageY);????????????handle.lastMouseX=e.pageX;????????????handle.lastMouseY=e.pageY;????????????document.onmousemove=Drag.drag;????????????document.onmouseup=Drag.end;????????}????},????start:function(e){????????var?handle=Drag.obj=this;????????e=Drag.fixEvent(e);????????var?top=parseInt(handle.root.style.top);????????var?left=parseInt(handle.root.style.left);????????//alert(left)????????//一般情况下?left?top?在初始的时候都为0????????handle.root.onDragStart(left,top,e.pageX,e.pageY);????????handle.lastMouseX=e.pageX;????????handle.lastMouseY=e.pageY;????????document.onmousemove=Drag.drag;????????document.onmouseup=Drag.end;????????return?false;????},????????drag:function(e){//这里的this为document?所以拖动对象只能保存在Drag.obj里????????e=Drag.fixEvent(e);????????var?handle=Drag.obj;????????var?mouseY=e.pageY;????????var?mouseX=e.pageX;????????var?top=parseInt(handle.root.style.top);????????var?left=parseInt(handle.root.style.left);//这里的top和left是handle.root距离浏览器边框的上边距和左边距????????????????var?currentLeft,currentTop;????????currentLeft=left+mouseX-handl