当页面包含Google Map时修复IE7中CSS/JS下拉的最佳方法

Question

我有一个使用<ul>列表进行导航的页面(Javascript将样式更改为在mouseover上显示或不显示)。

这对我来说很好，除非在IE6和IE7中，当我在页面上有Google时。

在这种情况下，下拉列表根本不起作用。但是，该页面在FireFox 2中继续工作。

我做了一些研究，发现这可能是IE Select的一个例子，但我不确定，因为Google似乎使用的是<div>，而不是<iframe>。

是否有其他人遇到类似的问题，如果有，他们有什么建议来解决这个问题吗？

Answer 1

我不知道这是否会解决您的问题，但您可能需要尝试这个解决方案在ccsplay.co.uk，它解决了菜单出现在下拉列表下面的问题。我不知道它会不会成功，但值得一试。

Answer 2

我修正了一个类似的问题，即使用这个jQuery没有出现在IE6/IE7/IE8中的闪存电影中。

$(function () {
  $("#primary-nav").appendTo("#footer");
});

其中primary-nav是下拉容器元素的ID，footer是页面上最后一个元素的ID。然后，我使用绝对定位将下拉列表重新定位到它们所属的顶部。

之所以这样做，是因为IE比z-index更尊重源代码排序。不过，它仍然无法在插件的顶部显示。

Answer 3

我相信这可能是因为一个Active-X的东西IE 6+用来解析CSS。

随着时间的推移，我不得不调整我的工作，以包括一些IE黑客在我的CSS，以使它能兼容多个浏览器。

我首先尝试制作一个没有Javascript的菜单，使用纯CSS并包括我提到的黑客。这可能会解决你的问题。实际上，您不需要Javascript来更改鼠标上的样式和类似的东西。

如果您想查看CSS黑客的内容:单击这里

如果您想查看一些纯CSS菜单示例:单击这里

希望这能有所帮助！