我的 javascript 下拉导航菜单显示在 Internet Explorer 7 中的内容后面答案

【问题标题】：My javascript drop down navigation menu displays behind content in internet explorer 7我的 javascript 下拉导航菜单显示在 Internet Explorer 7 中的内容后面
【发布时间】：2013-05-22 05:12:44
【问题描述】：

好的，所以我正在重新设计，我们已经解决了大部分跨浏览器 CSS 兼容性错误 - 除了 ie7 中的一个明显错误。

问题是我们使用 JavaScript 作为导航菜单下拉菜单。在除了指出的罪魁祸首之外的所有浏览器中，一切都按预期运行。

但是，在 IE7 中，我的下拉菜单出现在我的其他页面元素后面，好像 z-index 设置为负数。但我确实应用了一条 CSS 规则，将这个元素的 z-index 设置为 4000，并使用该规则来纠正现代浏览器上的相同问题。

由于某些原因，IE7 无法识别该规则。 IE7 不支持这个 CSS 规则吗？如果没有，关于如何为 IE7 解决它的任何建议？ JavaScript 解决方案？

这里是有问题的页面：http://betawww.helpcurenow.org/

谢谢！

【问题讨论】：

标签： javascript css z-index internet-explorer-7

【解决方案1】：

好的，感谢 Scott 关于 IE7 z-index 问题的建议，在做了一些研究后，我在http://webdemar.com/webdesign/superfish-jquery-menu-ie-z-index-bug/找到了解决方案

问题是我的包含元素（div#header 和 div#mainContent）需要为 IE7 分配 z-index 值才能解决此问题。

【讨论】：

【解决方案2】：

我也遇到了这个问题，但是为包含的元素（菜单）分配高 z-index 并不能解决问题本身。我不得不添加 position: relative 以将其推到顽固的脚本前面（当然，将 z-index: 0 分配给图像脚本）。

【讨论】：

【解决方案3】：

在 Internet Explorer 中，定位元素会生成一个新的堆叠上下文，从 z-index 值 0 开始。因此 z-index 无法正常工作。

这可能是问题的一部分，如果您需要 JS 解决方案，您可以查看以下项目：

http://code.google.com/p/ie7-js/

【讨论】：

【解决方案4】：

好的，感谢 Scott 关于 IE7 z-index 问题的建议，在做了一些研究后，我在http://webdemar.com/webdesign/superfish-jquery-menu-ie-z-index-bug/找到了解决方案

问题是我的包含元素（div#header 和 div#mainContent）需要为 IE7 分配 z-index 值才能解决此问题。

这非常有用。非常感谢。

【讨论】：

【解决方案5】：

将您的菜单放入一个新的 DIV 中，并为该 DIV 赋予 z-index（更大的值）。

【讨论】：

【解决方案6】：

我遇到了这个问题，我把这段代码放在有问题的页面中，它就解决了。只需将 div 替换为任何元素即可。

<script>$(function() {
var zIndexNumber = 1000;
$("div").each(function() {
$(this).css('zIndex', zIndexNumber);
zIndexNumber -= 10;
});
});
</script>

【讨论】：