0

网站：http ://bit.ly/Pa3xJS

使用 IE（9 或更低版本），当悬停在主页上的任何菜单上并尝试选择项目 2+ 时，即：悬停在 Shop 上并尝试单击 Brushes 或 Haircare，菜单就会消失。

我怀疑这是由于我的幻灯片内容，但是我尝试过的一切（CSS hacks 和 JS 更改）并没有让菜单按应有的方式工作，并且在 FF、Chrome 和 Safari 上也是如此。

是否有针对此的特定 IE 修复或我错过的 CSS hack？

编辑：我已经更新了 Justus 的 CSS fiddle 以包含没有无关代码的幻灯片内容 - http://jsfiddle.net/eN7sh/14/。随意玩，只是寻找IE上的问题..主要是IE9。

4

2 回答 2

1

您的网站有很多其他代码，因此很难看出问题的真正原因。不久前，我摆弄了一个仅限 CSS 的 3 级菜单：http: //jsfiddle.net/eN7sh/12/

我很确定如果您可以匹配css/它将起作用html，尽管li:hover在 IE7 上可能不起作用。如果必须，您可以只使用 javascript 在hover事件上添加一个类名并使用它。小提琴代码：HTML：

<ul class="main">
  <li ><a href="#">Link one</a></li>
  <li><a href="#">Link two</a>
    <ul>
      <li><a href="#">Sublink one</a></li>
      <li><a href="#">sublink two</a>
        <ul>
          <li><a href="#">Sub sublink one</a></li>
          <li><a href="#">Sub sublink two</a></li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

CSS：

ul.main {
}
.main li {
    float: left;
    position: relative;
}
.main ul {
    position: absolute;
    display: none;
    left: 0;
    top: 1em;
}
.main li:hover > ul {
    display: block;
}
.main ul li {
    display: block;
    float: none;
    white-space:nowrap;
}
.main ul ul {
    left:100%;
    top: 0;
​}​
于 2012-10-03T11:11:07.743 回答
0

我在 ie 8 上检查了你的网站。它工作正常..

你应该做的只有一件事

申请

子菜单项上的 z-index 属性。

于 2012-10-03T11:39:32.717 回答