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

Question

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

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

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

由于某些原因 IE7 不识别该规则。 IE7不支持这个CSS规则吗？如果没有，有什么建议可以解决 IE7 的问题吗？ JavaScript 解决方案？

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

谢谢！

Answer 1

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

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

Answer 2

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

Answer 3

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

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

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

Answer 4

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

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

这非常有用。太感谢了。

Answer 5

将菜单放入新的 DIV 中，并为该 DIV 指定 z-index（更大的值）。

Answer 6

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

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