Html 如何在 Google 地图上浮动 div?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6037712/
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
How to float a div over Google Maps?
提问by Adham
I have a div
that displays a Google map.
我有一个div
显示谷歌地图的。
How do I make another div
float over the map div
?
如何让另一个div
浮动在地图上div
?
回答by Dan
Try this:
尝试这个:
<style>
#wrapper { position: relative; }
#over_map { position: absolute; top: 10px; left: 10px; z-index: 99; }
</style>
<div id="wrapper">
<div id="google_map">
</div>
<div id="over_map">
</div>
</div>
回答by Matheus
#floating-panel {
position: absolute;
top: 10px;
left: 25%;
z-index: 5;
background-color: #fff;
padding: 5px;
border: 1px solid #999;
text-align: center;
font-family: 'Roboto','sans-serif';
line-height: 30px;
padding-left: 10px;
}
Just need to move the map below this box. Work to me.
只需将地图移动到此框下方即可。为我工作。
From Google
来自谷歌
回答by Adrian Rodriguez
Just set the position of the div and you may have to set the z-index.
只需设置 div 的位置,您可能需要设置 z-index。
ex.
前任。
div#map-div {
position: absolute;
left: 10px;
top: 10px;
}
div#cover-div {
position:absolute;
left:10px;
top: 10px;
z-index:3;
}
回答by atnmachine
absolute positioning is evil... this solution doesn't take into account window size. If you resize the browser window, your div will be out of place!
绝对定位是邪恶的......这个解决方案没有考虑窗口大小。如果您调整浏览器窗口的大小,您的 div 将不合适!