js 页面模块自由拖动实例

js页面模块自由拖动

.removableObj
{
height:25;position:relative;
}


var beginMoving=false;
var sourceObj=null;
var objectObj=null;
function MouseDownToMove(obj){
obj.style.zIndex=1;
obj.mouseDownY=event.clientY;
obj.mouseDownX=event.clientX;
beginMoving=true;
obj.setCapture();
sourceObj=obj;
objectObj=null;
}
function MouseMoveToMove(obj){
if(!beginMoving) return false;
obj.style.top = (event.clientY-obj.mouseDownY);
obj.style.left = (event.clientX-obj.mouseDownX);
}
function MouseUpToMove(obj){
if(!beginMoving) return false;
obj.releaseCapture();
obj.style.top=0;
obj.style.left=0;
obj.style.zIndex=0;
beginMoving=false;
window.setTimeout("swapFun()",10);
}
function MouseOverFun(obj)
{
objectObj=obj;
}
function swapFun()
{
if(sourceObj!=null && objectObj!=null )
sourceObj.swapNode(objectObj);
sourceObj=null;
objectObj=null;
}



用鼠标移动TD(本代码也适合用鼠标进行其它对象的对换（如table,div等）)


a1
a2


b1
b2




[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]