上网的时候经常看到鼠标移到某一对象上会弹出一个菜单层，显示该对象的详细内容或与之相关的内容。知道是用一个层（div）来实现的，就是没有亲自动手做过。
“看花容易绣花难”。动起手来才知道有那么多繁琐的细节让人头痛。
开始我的思路是：在鼠标移到一个对象上，显示层。层显示在最前面（z-index），层的位置是相对与触发事件（onmouserover）的对象,即层的位置是相对的(position:relative)。
按照这个思路去做，先用css控制层的样式。下面是div的css：
style="background: red; 100px; position: relative; display: none; z-index: 1000;"
写js代码：
Code
}然后调用js：
<div>
<table>
<tr>
<td>
<a href="#" onmouseover="show();" onmouseout="hidden();">弹出菜单...</a></td>
</tr>
</table>
</div>
不过，最后层老是不能浮动。
在网上查阅了一些资料才发现div的css有问题，不应是相对位置(position:relative)，而应是绝对位置（position: absolute）。
下面是代码：
Code
}批注：
offsetX：检查相对于触发事件的对象，鼠标位置的水平坐标
offsetY：检查相对于触发事件的对象，鼠标位置的垂直坐标
不能眼高手低，得多动手。