为什么下拉菜单隐藏在jQuery按钮后面？

Question

为什么菜单下拉隐藏在jQuery按钮后面？

div.menu ul li a, div.menu ul li a:visited
{
    background-color: #465c71;
    border: 1px #4e667d solid;
    color: #dde4ec;
    display: block;
    line-height: 1.35em;
    padding: 4px 20px;
    text-decoration: none;
    white-space: nowrap;
    position: relative;
    z-index: 9999;
}

Answer 1

我也遇到了这个问题。我找到了原因和解决方案。

原因：按钮在菜单后呈现，但jquery-ui已被一些其他元素包裹，因此其z-index已增加。

解决方案：为了克服这个问题，我们可以增加菜单z-index（比减少许多按钮的z-index更好）。但请记住

  

“z-index仅适用于定位元素（position:absolute，position:relative或position:fixed）”

那样我们也需要定位我们的菜单。这是我的代码：

<div style="position:relative;z-index:99"> MENU HERE </div>

Answer 2

试试这个

div.menu 
{

   z-index : 9999;
}

好像你只是设置活动的一个z-index .. 不活动的人会怎样？

Answer 3

我有一个jquery组合框插件，如果父div不够大，它不会显示完整的下拉列表。经过大量的研究和搞乱z-index等事情，我发现我需要将父div溢出更改为＆＃34; visible＆＃34;。如果您遇到同样的问题，这可能对某人有所帮助。

Answer 4

您可能需要检查列表的z-index是否高于按钮，如此

div.menu ul li {
 z-index:999;
}

.yourbutton {
 z-index: 1;
}

但请粘贴您的html代码供我们查看。