IE7 中 bxslider 的 z-index 菜单问题

【问题标题】：z-index menu issue with bxslider in IE7IE7 中 bxslider 的 z-index 菜单问题
【发布时间】：2014-02-06 17:37:38
【问题描述】：

我正在使用 BX 滑块顶部的下拉菜单，但我根本无法让它在 IE7 中显示在顶部！我到处寻找答案，仅在子项上的相对位置似乎不起作用。请问有人可以帮忙吗？

这里是测试页面：http://theturning.co.uk/AMBA-NEW/

Ps - 我已经检查并尝试了 SO 上关于 IE z-index 错误的其他帖子，但对我没有任何帮助。

【问题讨论】：

所以.submenu { position: relative; z-index: 3000; } 不起作用，对吧？

标签： jquery css internet-explorer-7 bxslider

【解决方案1】：

我发现这些问题通常与没有设置 z-index 的父容器有关。尝试将标题元素上的 z-index 设置为 1

header {
   z-index: 1;
}

【讨论】：

我在 IE 7 中对此进行了测试，并将 z-index 添加到标题元素有效。

【解决方案2】：

我遇到了同样的问题，我修复如下，

考虑如下下拉导航菜单，

<ul id="nav">
    <li>Menu Item 1</li>
    <li>Menu Item 2
        <ul>
            <li>Sub Menu Item 1</li>
            <li>Sub Menu Item 2</li>
            <li>Sub Menu Item 3</li>
        </ul>
    </li>
    <li>Menu Item 3
        <ul>
            <li>Sub Menu Item 1</li>
            <li>Sub Menu Item 2</li>
        </ul>
    </li>
</ul>

为所有子元素和孙元素设置 z-index，如下所示，

ul#nav * { z-index:9999 } /* maximum zoom index as your wish */

【讨论】：