|
阅读：5285回复：4
[求助]哪位朋友能解释一下这个菜单的原理啊？
最近做网页菜单，用到了一段代码，虽说知道怎么用，可是看了没天还是没能看出它是如何产生这样的效果的，所以发个帖子来问一下。原代码如下：
--------------------------------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>无标题文档</title> </head> <body> <div style="background-color:#999999;width:100px;height:20px;" onmouseover="myMenu.style.display='block'" onmouseout="myMenu.style.display='none'"> <div style="position:absolute; width:0px; height:0px; overflow:visible;"> <div id=myMenu style="position:absolute;top:15px;display:none;width:100px;background-color:#339999;"><a>Link 1</a><br><a>Link 2</a><br><a>Link 3</a></div> </div> 菜单实例</div> </body> </html> ------------------------------------------------------------------------------------------------------------------------------------------ 我想问的问题是，在第一个DIV处设定当鼠标移入时，显示myMenu。当鼠标移出时，不显示myMenu。可是为什么当我向下移出时，仍然能够显示myMenu？我想应该是第二个DIV的原因，可它是怎么起作用的呢？如果哪位朋友知道其中的原因的，请告诉小弟一下。由于小弟刚学，知道不多，所以请尽量具体一些，不胜感谢。（发帖前我在网上查了许多资料，可是没法找到答案，没有办法，所以来这里麻烦各位高手了。）  |
|
|
|
1楼#
发布于：2005-03-07 22:59
FF 下面好像没有效果。
总共有三层 DIV ，第一层，开始定义为高度 20px ，其中嵌套的 ID 为 myMenu 的 DIV 因为 display=none 而不占用高度。可以触发行为的高度只有 20px 高度的区域。一旦触发，myMenu 的 display 成为 block ，这样可以触发行为的区域高度也更改了（最外层的高度被撑开，而行为是定义在这层上面的）。 基本就是这个意思了，啰嗦了点。不知道楼主看明白没有？ |
|
|
2楼#
发布于：2005-03-07 22:59
多谢楼上的朋友，基本上明白了，只是还有一点细节不太清楚，自己再研究一下。刚才在FF里试了一下，发现无效，如果我想在FF里实现这样的效果，要怎么做呢，如果楼上的朋友知道，能不能麻烦你再说一下？谢谢。
|
|
|
|
3楼#
发布于：2005-03-07 22:59
<div style="position:absolute; width:0px; height:0px; overflow:visible;">
<div id=myMenu style="position:absolute;top:15px;display:none;width:100px;background-color:#339999;"><a>Link 1</a><br><a>Link 2</a><br><a>Link 3</a></div> </div> 这个层什么用？ |
|
|
4楼#
发布于：2005-03-07 22:59
我也是这点不清楚。但大意有点明白。有一点要注意，就是弹出的第三层必须在显示后有一部分是盖在第一层上的，这样一来当鼠标向下行动时，在它还没有完全移出时，已经进入了第三层，也就是盖住的那一部分，这时就激活第二层，所以当鼠标移出时，仍然有效，不知道是不是这么个理。
|
|
|
