使用 jQuery Superfish 菜单插件解决 IE7 中的 Z-index 问题

Question

我需要修改 jQuery Superfish 菜单插件以适应菜单图像的使用。

Om oss 和Medieomtale 下有子菜单。 我在这个菜单中使用了精灵图像。

它在 IE8、FF 等上运行良好。但是 IE7 有显示子菜单的问题。 它显示子菜单，但当我尝试在子菜单中导航时，它会淡出。

编者注

此问题中用于演示该问题的 www.okadadesign.no 链接已被删除，因为它不再可访问。

Answer 1

我通过添加以下内容修复了 IE7 和 IE6 的 z-index 问题：position:relative; z 索引：10000； 到包含（sf-menu）的主#nav div，工作就完成了。

Answer 2

我总是必须在 .sf-menu li li 上放置一个 z-index 才能让子菜单显示在 ie6/7 中。

使用 hoverIntent 也可能有所帮助。 superfish 页面上有详细信息。

Answer 3

它也可能像没有在 .sf_menu li ul 上指定“背景”一样愚蠢。 我使用了渐变（IE 中的过滤器）并且没有指定原始背景颜色。

  background: #F3F3F3; /* required for IE to retain hover state */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F3F3F3', endColorstr='#D8D8D8');
  background: -webkit-gradient(linear, left top, left bottom, from(#F3F3F3), to(#D8D8D8));
  background: -moz-linear-gradient(top,  #F3F3F3,  #D8D8D8);