弹出菜单下面有下拉框或FLASH等，菜单都会被他们所覆盖（在线等！！）

Question

页面中左侧有菜单，有的页面中有下拉框，菜单就会被下拉框所覆盖，看不到菜单显示的内容。肯请高手指点！

Answer 1

你是用DIV写的层次关系吗？

Answer 2

<%@ Control Language="c#" AutoEventWireup="false" Codebehind="Left.ascx.cs" Inherits="Manage.MemberLt.membercontrols.Left" TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>
<style type="text/css">
/* common styling */
.menu {font-family: verdana, arial, sans-serif; width:148px; height:150px; position:relative; font-size:11px; margin-left:16px; text-align:center}
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;width:144px; height:28px; color:#fff; border-bottom:1px solid #C4D9F3; background-image: url(images/mc_bt.gif); line-height:28px;font-size:15px;}
.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {float:left; position:relative; margin-right:144px;}
.menu ul li ul {display: none;}
/* specific to non IE browsers */
.menu ul li:hover a {color:#000;background:#DDF2FF; }
.menu ul li:hover ul {display:block; position:absolute; bottom:0px; left:144px;}
.menu ul li:hover ul li a.hide {background:#1874BD; color:#fff;}
.menu ul li:hover ul li {display:block; background:#DDF2FF; color:#fff;width:105px; clear:both;}
.menu ul li:hover ul li:hover a.hide {background:#dfc184; color:#000;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; background:#1874BD; color:#fff; width:100%; padding-left:10px;}
.menu ul li:hover ul li a:hover {background:#dfc184; color:#000;}
.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:115px; bottom:0;}
.menu ul li:hover ul li:hover ul li a {background:#1874BD; color:#fff;}
.menu ul li:hover ul li:hover ul li a:hover {background:#DDF2FF; color:#000;}
.menu ul li:hover ul.left {left:0px;}
.menu ul li:hover ul li:hover ul.left {left:0px; width:144px;}
</style>
<!--[if lte IE 7]>
<style type="text/css">
table {border-collapse:collapse; margin:0; padding:0;}
.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}
.menu ul li a:hover {color:#000; background:#DDF2FF;}
.menu ul li a:hover ul {display:block; position:absolute; bottom:0px; left:144px;}
.menu ul li a:hover ul li {display:block; background:#fff; color:#000; width:105px;}
.menu ul li a:hover ul li a.sub {background:#1874BD; color:#fff;}
.menu ul li a:hover ul li a {display:block; background:#1874BD; color:#fff; width:100%; padding-left:10px;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background:#dfc184; color:#000;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:105px; bottom:0;}
.menu ul li a:hover ul li a:hover ul li a {background:#DDF2FF; color:#000;}
.menu ul li a:hover ul li a:hover ul li a:hover {background:#1874BD; color:#fff;}
.menu ul li a:hover ul.left {left:0px;}
.menu ul li a:hover ul li a:hover ul.left {left:0px;}
</style>
<![endif]-->
<table>
<tr>
<td width="162px" valign="top">
<div class="menu">
<ul> <li>
<a href="#" class="hide">预约服务</a> 
<!--[if lte IE 7]>
<a href="#" >预约服务
<table><tr><td>
<![endif]-->
<ul>
<li>
<a class="hide" href="Member_Tijian_TC.aspx">预约体检</a> 
<!--[if lte IE 7]>
  <a class="sub" href="Member_Tijian_TC.aspx">预约体检 
  <table><tr><td>
  <![endif]-->
<ul>
<li>
<a href="Member_Tijian_His.aspx">预约体检历史</a></li>
</ul>
<!--[if lte IE 7]>
   
    </td></tr></table>
  </a>
  <![endif]-->
</li>


</ul>
</div>
</td>
</tr> </table> 

Answer 3

在同一页面中，如果有下拉框，下拉框就会把该页的层档住，IE6就是这样， IE7似乎不会，这是MS的一个bug。
没有太好的办法解决。
菜单页与功能页若采用框架结构（即不在同一页），应该不出现这样的问题。

Answer 4

帮你找了一下，可以试试：
(1)
只要在div内容后面添加如下代码就可以了 
<iframe src="javascript:false" style="position:absolute; visibility:inherit; top:0px; left:0px; width:100px; height:200px; z-index:-1; filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)';"></iframe>(2)http://dengjianqiang200.blog.163.com/blog/static/658119200791542935305/

Answer 5

bluesea999 :
在同一页面中，如果有下拉框，下拉框就会把该页的层档住，IE6就是这样，   IE7似乎不会，这是MS的一个bug。 
没有太好的办法解决。 
菜单页与功能页若采用框架结构（即不在同一页），应该不出现这样的问题。==========================================================================================呵呵，刚听了你的建议，试着用火狐浏览器打开，结果是原来网页的样式改变了。但这个问题解决了。
实在不行只能把这个菜单栏目下移到下拉框覆盖不到的位置 -_-!!

Answer 6

遇到和楼主相同的问题，我的解决方案是，当菜单显示时自动隐藏所有的下拉框，当菜单关闭时，自动显示所有的下拉框function hideSelect()
{
selectTags =document.getElementsByTagName("SELECT");
for (a=0;a<selectTags.length;a++){
selectTags[a].style.visibility="hidden";
}
}
function showSelect()
{
selectTags =document.getElementsByTagName("SELECT");
for (a=0;a<selectTags.length;a++){
selectTags[a].style.visibility="visible";
}
}

Answer 7

<script type="text/javascript" language="javascript">
function hideSelect()
{
    selectTags =document.getElementsByTagName("SELECT");
    for (a=0;a<selectTags.length;a++){
        selectTags[a].style.visibility="hidden";
    }
}
function showSelect()
{
    selectTags =document.getElementsByTagName("SELECT");
    for (a=0;a<selectTags.length;a++){
        selectTags[a].style.visibility="visible";
    }
}
</script>