高分求动态生成div隐藏菜单的规范代码

要求：鼠标划过页面table的每个cell的时候，出现一个里面有链接的小菜单，鼠标划出就消失。
问题：动态生成div，隐藏的时候不知道怎么计算隐藏区域，如果只用hidden属性，就会一闪而过，不能点到div的里面链接。网上搜的代码都很乱，哪位有规范点的代码或者相似的网站源码，帮帮忙！

解决方案 »

  1.   

    <!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">
    function moveheight()
    {
    var objcm=document.getElementById("clickme");
    document.getElementById("listdiv").style.top=objcm.scrollHeight;
    }
    function showdiv()
    {
    document.getElementById("listdiv").style.display="";
    }
    function hiddendiv()
    {
    document.getElementById("listdiv").style.display="none";
    }
    </script>
    </head><body onload="moveheight()">
    <table id="tb" border="1" width="100px" style="position:relative;">
      <tr>
        <td id="clickme" onmousemove="showdiv()" onmouseout="hiddendiv()">点我
    <div id="listdiv" style="position:absolute; z-index:2; left:0; top:0; display:none; float:left;" onmouseout="hiddendiv()">
    <table border="1">
      <tr>
        <td>---1---</td>
      </tr>
      <tr>
        <td>---2---</td>
      </tr>
      <tr>
        <td>---3---</td>
      </tr>
      <tr>
        <td>---4---</td>
      </tr>
    </table> </div>
    </td>
      </tr>
    </table>
    </body>
    </html>
    我高度调节不好...
      

  2.   

    不显示框倒没什么问题但cellspacing为0的话高度就不能被控制了...
      

  3.   

    谢谢楼上的
    但我要的是每次鼠标划过的时候动态生成div,要计算显示位置和隐藏位置