<!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 LANGUAGE="JavaScript">
<!--
var currentMoveObj = null; //當前拖動對象
var relLeft; //鼠標按下位置相對對象位置
var relTop;
function f_mdown(obj)
{
currentMoveObj = obj; //當對象被按下時，記錄該對象
currentMoveObj.style.position = "absolute";
relLeft = event.x - currentMoveObj.style.pixelLeft;
relTop = event.y - currentMoveObj.style.pixelTop;
}
window.document.onmouseup = function()
{
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:50;top:50" οnmοusedοwn="f_mdown(this)" οnmοusemοve="f_move(this)">
<TR>
<TD bgcolor="#CCCCCC" align="center" style="cursor:move">title1</TD>
</TR>
<TR>
<TD align="center" height="60">content</TD>
</TR>
</TABLE>
<TABLE width="100" border=1 onselectstart="return false" style="position:absolute;left:350;top:250" οnmοusedοwn="f_mdown(this)" οnmοusemοve="f_move(this)">
<TR>
<TD bgcolor="#CCCCCC" align="center" style="cursor:move">title2</TD>
</TR>
<TR>
<TD align="center" height="60">content</TD>
</TR>
</TABLE>
</BODY>
</html>