gpt4 book ai didi

jquery - UL 菜单显示在 jQuery UI 选项卡和图像后面

转载 作者:行者123 更新时间:2023-11-28 00:22:20 25 4
gpt4 key购买 nike

我创建了一个 HTML 页面,它使用简单的 CSS(无 javascript)进行菜单导航。然而,我使用 jQuery UI 选项卡在同一页面上显示选项卡式数据。

当菜单下拉时,它出现在 jQuery 选项卡的后面(实际上,菜单也出现在菜单落在其上的文本中的任何图像后面。

我的(准系统)HTML 看起来像这样:

<html>
<body>
<div>
<div id="navigation2">
<ul id="menu" style="margin-left:5px;">
<li class="navigable">
<a class="menuitem" href="#">Foo</a>
<ul class="submenu">
<li><a href="">Foo Bar 1</a></li>
<li><a href="">Foo Bar 2</a></li>
<li><a href="">Foo Bar 3</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div id ="tdisp">
<!-- jQuery tab display here ... -->
</div>
</body>
</html>

CSS 文件看起来像这样:

#navigation2{

background-color: #2d2d2d;

color: #FFFFFF;

height: 35px;

list-style-type: none;

font-size: 15px;

}



#navigation2 ul li {

list-style-type: none;

padding: 7px 20px 7px 5px;

float: left;

}



#navigation2 a.menuitem, #navigation2 a.undecorated {

color: #CCCCCC;

text-decoration: none;

}





#navigation2 a.current{

color:#FF0000;

}



#navigation2 ul li.navigable:hover {

cursor: pointer;

color: #FFFFFF;

background-color: #535354;

border-bottom-color: #c00000;

border-bottom-width: 2px;

border-bottom-style: solid;

}

我怀疑它与 z 顺序有关,但我不确定并且想听听这里的专家如何解决这个问题。

[[编辑]]

从我目前收到的答复来看,z-index 似乎是罪魁祸首。但是,有人可以提供更多有关如何实际解决此问题的详细信息吗? (我实际上是一名 C++ 开发人员,所以这对我来说是陌生的领域)。

  • 我是将 z-index 属性添加到每条涉及 navigation2 的规则,还是只添加到一个? - 如果只需要一个,我应该将 z-index 添加到 CSS 文件中的哪个规则条目?

  • 如何使用(最好)FF Firebug 或 Chrome 开发者工具检查 jQuery 选项卡的 z-index?

最佳答案

jack 说得对。提高 Z 指数。您可以在 Chrome 开发工具中检查 jquery 选项卡的 Z-Index,以确保您选择了更高的 Z-Index。我说检查 Chrome 开发工具(或 Firebug)的唯一原因是我上次检查时 jQuery UI 对话框的 Z-Index 为 1000。只需使用大得离谱的#

关于jquery - UL 菜单显示在 jQuery UI 选项卡和图像后面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8130557/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com