Html 使用 Google Maps API 将 div 置于 div 之上
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2786967/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
div on top of div with Google Maps API
提问by JHM_67
How do I float a div "menu" on top of my Google Maps API "map" div. And maybe possibly add a transparency of 50% on the menu div. Can this be done?
如何在我的 Google Maps API“地图”div 顶部浮动一个 div“菜单”。也许可能会在菜单 div 上添加 50% 的透明度。这能做到吗？
#map {width: 835px; height 540px; float: left;}
#menu {width: 145px; float: right; padding-top: 10px;}
<div id="map"></div>
<div id="menu"></div>
回答by Sarfraz
Can't you changed the positions of the DIVslike this:
你不能改变这样的位置DIVs：
<div id="menu"></div>
<div id="map"></div>
If not you could go something like this:
如果没有，你可以这样做：
<div id="map"></div>
<div id="menu"></div>
#menu
{
position: absolute;
top: 10px; /* adjust value accordingly */
left: 10px; /* adjust value accordingly */
}
Update 2
更新 2
Cross-browser transparency style:
跨浏览器透明样式：
.dropSheet
{
background-color: #000000;
background-image: none;
opacity: 0.5;
filter: alpha(opacity=50);
}
Just apply the class dropSheetto the element you want to make transparent.
只需将该类应用dropSheet到您要使其透明的元素即可。
回答by Sune Rasmussen
Well, the basic structure of a float should contain a wrapping element that has its position property set to something else than the default, and an element that clears the float in the end.
Like this:
好吧，浮点数的基本结构应该包含一个包装元素，该元素的位置属性设置为默认值以外的其他值，以及一个最终清除浮点数的元素。
像这样：
#wrapper {
position:relative;
}
#menu {
float:right;
}
<div id="wrapper">
<div id="map"></div>
<div id="menu"></div>
<br clear="both" />
</div>
The code provided has not specifically been tested, but the float and the fact that the menu is the higher layer than the map, should make the menu on top of the map in the right side. For the transparency issue, see this fantastic resource.
提供的代码没有经过专门测试，但是浮动和菜单比地图高的事实应该使菜单在右侧地图的顶部。对于透明度问题，请参阅这个奇妙的资源。
Hope that helped you out.
希望能帮到你。
