为什么我这个不能实现拖拽功能呢,求指教!

[code]<!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" />
<title></title>
<script type="text/javascript">
var currentMoveObj = null;
var relLeft;
var relTop;

function f_mdown(obj){
    currentMoveObj = obj;
    currentMoveObj.setCapture();
    currentMoveObj.style.position = "absolute";
    relLeft = event.x - currentMoveObj.style.pixelLeft;
    relTop = event.y - currentMoveObj.style.pixelTop;
}

window.document.attachEvent('onmouseup', function(){
    currentMoveObj.releaseCapture();
    currentMoveObj = null;
});

function f_move(obj){
    if(currentMoveObj != null){
        currentMoveObj.style.pixelLeft=event.x-relLeft;
        currentMoveObj.style.pixelTop=event.y-relTop;
    }
}

</script>
</head>
<body>
<table width="100" border="1" onselectstart="return false" style="position:absolute;left:50px;top:50px" onmousedown="f_mdown(this)" onmousemove="f_move(this)">
<tr>
<td bgcolor="#CCCCCC" align="center" style="cursor:move">title1 </td>
</tr>
<tr>
<td align="center" height="60"> content1 </td>
</tr>
</table>
<table width="100" border="1" onselectstart="return false" style="position:absolute;left:350px;top:250px" onmousedown="f_mdown(this)" onmousemove="f_move(this)">
<tr>
<td bgcolor="#CCCCCC" align="center" style="cursor:move">title2 </td>
</tr>
<tr>
<td align="center" height="60"> content2 </td>
</tr>
</table>
</body>
</html>
[/code]

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复