<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
</style>
<title>drag table cell</title></head><body style="margin-left:0px; margin-top:0px;"><table id='test' onmouseover="styleControl_show();" onmouseout="styleControl_hide();" style="width:'200px';zIndex:0;">
<tr><td>起始</td></tr>
<tr><td>结束</td></tr>
</table>
<br>
<!--<div  >-->
<input id='del' name='del' type=button value="delete" onclick='rowDel();' style='position:absolute;left:130px;top:50px;'>
<!--</div>-->
<script language="javascript" >
var obj;
var xx,yy;
var tagobj;
var dragobj;
var leftx,topy;
var active;
function dragtableinit(){
var tableobjs = document.getElementById("del");
tableobjs.onmousedown=mousedown;
tableobjs.ondragover=dragover;
tableobjs.ondragend=dragend;
tableobjs.ondrag=dragmove;
tableobjs.style.position="relative";
tableobjs.style.zIndex=1;
}function mousedown(){
obj = event.srcElement;
yy=event.clientY;
  xx=event.clientX;
leftx = obj.style.posLeft;
topy = obj.style.posTop;
obj.style.zIndex=1;
active = 'true';
try{
obj.dragDrop();
}catch(e){
}
}
function dragmove(){
obj.style.top = event.clientY-yy+topy;
  obj.style.left = event.clientX-xx+leftx;

}
function dragover(){
tagobj=event.srcElement;
}
function dragend(){
obj.style.top = event.clientY-yy+topy;
  obj.style.left = event.clientX-xx+leftx;
obj.style.zIndex=1;
tagobj=null;
active = 'false';
}
function styleControl_show(){
try{
var div_obj = document.all._dv;
for(i=0;i<div_obj.length;i++){
div_obj[i].style.display = '';
}
}catch(e){}
}
function styleControl_hide(){
try{
var div_obj = document.all._dv;
for(i=0;i<div_obj.length;i++){
div_obj[i].style.display = 'none';
}
}catch(e){}
}
function styleControl_show(){
if(active != 'true') return;
alert('a');
}
function styleControl_hide(){
         if(active != 'true') return;
alert('b');
}
dragtableinit();
</script>
</body>
</html>