Layer的定位问题~~

你要做到动态修改层的位置才行：<html><head><title>层与按钮对齐</title></head><body>
<div align=left><table border=1>
<tr><td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td>
    <td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td>
    <td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td></tr>
<tr><td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td>
    <td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td>
    <td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td></tr>
<tr><td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td>
    <td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td>
    <td align=center height=50 width=200>
    <input type=button value=ok onmouseover="cc(this)" onmouseout="document.all.pop.style.display='none'"></td></tr>
</table><div><div id=pop style="position:absolute;width:100;height:50;z-index:99;display:none">
<table border=0 bgcolor=#FF0000><tr><td align=center>层里文字</td></tr></table></div><script language=javascript>
function cc(tt)
{
  var daps  = document.all.pop.style;
  var ttop  = tt.offsetTop;     //TT控件的定位点高
  var thei  = tt.clientHeight;  //TT控件本身的高
  var tleft = tt.offsetLeft;    //TT控件的定位点宽
  var ttyp  = tt.type;          //TT控件的类型
  while (tt = tt.offsetParent){ttop+=tt.offsetTop; tleft+=tt.offsetLeft;}
  daps.top  = (ttyp=="image")? ttop+thei : ttop+thei+6; //层的 Y 坐标
  daps.left = tleft + 1;  //层的 X 坐标
  daps.display = "";  //层显示
}
</script>
</body></html>

解决方案 »

  1.   

    将Layer放在单元格内,再将单元格的格式设置如下:
    <td style="POSITION: relative">
       放layer
    </td>
    适当调整top,left的位置即可
      

  2.   

    应该是这样吧（相对定位的CSS语句写到层里）
    ------------------------------------------------------------------
    <table style="border:1px solid #000000;" cellpadding=0 align=center width=150 height=120>
      <tr>
        <td>
      <div style="position:relative;top:100;left:100;width:50;height:50;border:1px solid #FF0000;"></div>
    </td>
      </tr>
    </table>
    --------------------------------------------------------------------不过我发现position:relative时，有时会出问题：在本地没什么，如果是在一个服务器中，有时刚刚打开时位置不对！原因不明，刷新一下就好了，不知道有没遇到过这种情况的，倒底是什么原因造成的（IE Bug?）？其实可以这样来做，麻烦些，但不会出问题：
    --------------------------------------------------------------------
    <table style="border:1px solid #000000;" cellpadding=0 align=center width=150 height=120>
      <tr>
        <td valign=top>
      <div style="position:absolute;;width:0;height:0;">
        <div style="position:absolute;width:50px;height:50px;border:1px solid #FF0000;left:200px;top:200px;"></div>
      </div>
    </td>
      </tr>
    </table>
    --------------------------------------------------------------------这种写法我也觉得怪怪的其实，但是它管用，而且在反复使用的过程中，发现它比上面那种方法要稳定，没发现位置不对的情况。