IE 7 的 Superfish z-index 问题答案

【问题标题】：Superfish z-index issue for IE 7IE 7 的 Superfish z-index 问题
【发布时间】：2012-02-20 09:47:34
【问题描述】：

我似乎无法修复 IE7 for superfish 的 z-index 问题。

Jsfiddle example

我只需要在背景字体顶部显示菜单，而不是相反。

我尝试在 sh-menu 类和 li 类上添加 z-index，但似乎没有任何效果。

有什么需要看的吗？

【问题讨论】：

标签： jquery css internet-explorer-7 superfish

【解决方案1】：

我在 superfish 中设置 z-index 值的唯一两个地方是：

.sf-menu li {
    float: left;
    position: relative;
    z-index: 999; /* Ensure drop-down menus are always on top */
}

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
    left: 0;
    top: 100%;    /* Ensures that the drop down is always directly below the nav bar */
    z-index: 99;
}

【讨论】：

【解决方案2】：

尝试在这个css规则.sf-menu li.sfHover ul中设置position: absolute

http://jsfiddle.net/zSTum/1/

【讨论】：

【解决方案3】：

改为将z-index 属性添加到您的.menu 类中。

例如

.menu {
  z-index:9999;
}

【讨论】：

@JohnKim 在虚拟 PC 上全新安装的 IE7 上对其进行了测试，您是对的，它不起作用，嗯，在 MultipleIE 安装应用程序下测试，它在那里工作。我会再做一些测试并回来查看。
@JohnKim 顺便查了下IE8及以下对canvas的支持，好像没有，caniuse.com/canvas
有条件 CSS，所以如果它是 IE 画布就不会被触发。 Canvas 由 Cufon 仅供参考