<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> 创建与目标对象坐标相临的DIV </title>
<script language="javascript">
<!--
function getXY(Obj)
{
// 此方法取自 bbs.51js.com 宝玉
for (var sumTop=0,sumLeft=0;Obj!=document.body;sumTop+=Obj.offsetTop,sumLeft+=Obj.offsetLeft, Obj=Obj.offsetParent);
return {left:sumLeft,top:sumTop}
}
function getCellPos()
{
document.getElementById('cellPos')?document.getElementById('cellPos').removeNode(true):"";
var pos = getXY(event.srcElement);
var temp = document.createElement("DIV");
temp.style.position="absolute";
temp.style.width= event.srcElement.width;
temp.style.left = pos.left+10;
temp.style.top = pos.top-6;
temp.style.border=1;
temp.style.background="#969696";
temp.style.color="#FFFFFF";
temp.id = "cellPos";
temp.innerHTML = "<marquee scrollamount='2'>left:"+pos.left+"|top:"+pos.top+"</marquee>";
document.body.appendChild(temp);
}
// -->
</script>
<style type="text/css">
<!--
td {
font-size: 12px;
text-decoration: none;
}
-->
</style>
</head>
<body>
<table width="868" cellpadding="6" bgcolor="#969696" οnclick="getCellPos()">
<tr>
<td width="213" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="199" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="214" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="232" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
</tr>
<tr>
<td width="213" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="199" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="214" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="232" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
</tr>
<tr>
<td width="213" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="199" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="214" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
<td width="232" bgcolor="#E0E0E0">单击在此单元格位置上面创建DIV</td>
</tr>
</table>
</body>
</html>