在a上显示隐藏的div：在IE6中悬停 - 什么也没发生

Question

我的情况：

我有一个三层导航结构，将鼠标悬停在辅助级别的项目上应该显示一个div，其中包含第三级。

我附上了截图来帮助说明这一点：

我用来创建它的标记大致如下（已消毒）：

  <menu class="secondary-nav">
    <li>
      <a href="#">
         One
      </a>
      <div class="dropdown-menu">
         <ul>
            <li>A</li>
            <li>B</li>
            <li>C</li>
         </ul>
      </div>
    </li>
  </menu>

当您将鼠标悬停在＆＃39; Level 2＆＃39;时，＆＃39; Tertiary Level＆＃39; div应该出现。为此，我使用如下的CSS：

   menu.secondary-nav .dropdown-menu {display: none;}
   menu.secondary-nav a:hover .dropdown-menu {display: block;}

我的问题：

在IE6中，当我将鼠标悬停在＆＃39; Level 2＆＃39;时，没有任何反应。这只是IE6中的一个问题 - 所有其他浏览器都能正常工作。我的CSS选择器有问题吗？

非常感谢。

Answer 1

IE6不支持列表项上的:hover。你必须使用javascript来填充。

Answer 2

您可以使用精彩的ie7.js。

只需添加到您的HTML：

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script>
<![endif]-->

这将使ie6支持:hover所有元素，例如this demo。