谷歌地图下的菜单栏答案

【问题标题】：Menu bar under google map谷歌地图下的菜单栏
【发布时间】：2013-12-07 23:54:50
【问题描述】：

我的谷歌地图有问题，基本上在我网站的顶部我有一个菜单，即使你向下滚动页面，它也总是在顶部。

菜单的 CSS：

#MyMenu{
    width: 100%;
    height: 105px;
    position: fixed;
}

我从here 获得了我的 Google 地图脚本。

问题是，当我向下滚动页面以查看 Google 地图脚本时，菜单隐藏在我的 Google 地图下。

有什么方法可以让我的菜单始终高于所有 div 和脚本？因为现在它在我的谷歌地图下。

【问题讨论】：

【解决方案1】：

尝试在您的菜单上添加较高的 z-index 值。

z-index:1000

它需要高于包含地图的部分。如果这似乎没有效果，您可能还需要在菜单的父级上定义 position:relative 和 z-index。您可以使用 FireBug 或 Chrome 开发者工具轻松测试。

【讨论】：

【解决方案2】：

假设您的地图包含在页面上的特定元素中，例如：

<div id="gmap"></div>

你可以使用 CSS 给它一个z-index：

#gmap {
    z-index: 100;
    position: relative;
}

并给#MyMenu一个更高的z-index：

#MyMenu {
    z-index: 110;
    width: 100%;
    height: 105px;
    position: fixed;
}

【讨论】：