var Obj=''
var index=10000;//z-index;
document.onmouseup=onMouseUp
document.onmousemove=onMouseMove
Obj=getObject(Object).id
document.all(Obj).setCapture();
pX=event.x-document.all(Obj).style.pixelLeft;
pY=event.y-document.all(Obj).style.pixelTop;
}
function onMouseMove(){
if(Obj!=''){
document.all(Obj).style.left=event.x-pX;
document.all(Obj).style.top=event.y-pY;
}
}
function onRemove(){
if (event){
lObj = event.srcElement ;
n=0;
while (lObj && n<5) {
lObj = lObj.parentElement ;
if(lObj.tagName=="DIV") break;
n++;
}
}
var id=lObj.id
document.getElementById(id).removeNode(true);
}
function onMouseUp(){
if(Obj!=''){
document.all(Obj).releaseCapture();
Obj='';
}
}
function getObject(objectId) {
if(document.getElementById && document.getElementById(objectId)) {
// W3C DOM
return document.getElementById(objectId);
} else if (document.all && document.all(objectId)) {
// MSIE 4 DOM
return document.all(objectId);
} else if (document.layers && document.layers[objectId]) {
// NN 4 DOM.. note: this won't find nested layers
return document.layers[objectId];
} else {
return false;
}
}
</SCRIPT>
<div id="obj11" style="POSITION: absolute;">
<table>
<tr>
<td onMouseDown="onMouseDown('obj11');" style="CURSOR: move">移动
<a title=关闭纸条 style="CURSOR: hand" onClick=onRemove()>×</a></div>
</td>
</tr>
<tr>
<td style="CURSOR: default">
<div>第11条</div>
<div>11asdfasdf<BR> </div>
</td>
</tr>
</table>
</div>
<script type="text/javascript">
<!--
window.onload=function(){
objDiv = document.getElementById('drag');
drag(objDiv);
};
function drag(dv){
dv.onmousedown=function(e){
var d=document;
e = e || window.event;
var x= e.layerX || e.offsetX;
var y= e.layerY || e.offsetY;
//设置捕获范围
if(dv.setCapture){
dv.setCapture();
}else if(window.captureEvents){
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
d.onmousemove=function(e){
e= e || window.event;
if(!e.pageX)e.pageX=e.clientX;
if(!e.pageY)e.pageY=e.clientY;
var tx=e.pageX-x;
var ty=e.pageY-y;
dv.style.left=tx;
dv.style.top=ty;
};
d.onmouseup=function(){
//取消捕获范围
if(dv.releaseCapture){
dv.releaseCapture();
}else if(window.captureEvents){
window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);
}
//清除事件
d.onmousemove=null;
d.onmouseup=null;
};
};
}
//-->
</script>
<div id="drag" style="POSITION: absolute; cursor:move" >drag me <div>
--------------------------------------
setCapture 的意思就是设置一个对象的方法被触发的范围,或者作用域。
如果不设置,则div只在当前窗口内被触发。如果设置,则在整个浏览器范围内被触发,也就是可以拖到浏览器外面