OpenLayers - HTML DIV 覆盖

发布于 2024-11-28 18:16:58 字数 364 浏览 2 评论 0原文

我正在使用 OpenLayers 在标准 HTML 页面上显示地图，并且我想创建一个位于地图顶部的 div。然而，div 似乎总是被地图图块遮挡。

我相信有一种方法可以将元素添加到地图本身，但在这种情况下，这不是一个可行的选择，因为 div 可能会部分浮动在地图上，部分浮动在其他页面元素上。

<div id="maphost" style="width: 100%; height: 100%" />
<div id="overlay" />

这就是基本的 HTML。我需要向任一 DIV 添加哪些 CSS 值才能实现此目的？

原文

I'm using OpenLayers to display a map on a standard HTML page, and I want to create a div that sits on top of the map. However, the div always seems to be obscured by the map tiles.

I believe there is a way to add elements to the map itself, but in this case that isn't a viable option since the div will potentially float partially over the map, and partially over other page elements.

<div id="maphost" style="width: 100%; height: 100%" />
<div id="overlay" />

That is the basic HTML. What CSS values do I need to add to either DIV to make this possible?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

〃温暖了心ぐ 2024-12-05 18:16:59

添加 z 索引

<div id="maphost" style="width:100%; height:100%; z-index: 0"></div>
<div id="overlay" style="z-index:9999"></div>

add a z-index

<div id="maphost" style="width:100%; height:100%; z-index: 0"></div>
<div id="overlay" style="z-index:9999"></div>

回复收藏 0 原文

已下线请稍等 2024-12-05 18:16:59

另一种内部方法是使用以下 css：

div.olMapViewport {
     z-index: 0;
}

Another internal method for doing it is to use this css:

div.olMapViewport {
     z-index: 0;
}

回复收藏 0 原文

风透绣罗衣 2024-12-05 18:16:59

根据需要编辑此内容

  <div id="search" style="position: absolute; top: 10px; right: 10px; padding: 5px; background-color: rgba(255,255,255,0.5);">
  <input type="text" placeholder="Search photos by tag(s)" style="width: 200px">
  <button type="button">Search</button>

edit this as needed

  <div id="search" style="position: absolute; top: 10px; right: 10px; padding: 5px; background-color: rgba(255,255,255,0.5);">
  <input type="text" placeholder="Search photos by tag(s)" style="width: 200px">
  <button type="button">Search</button>

回复收藏 0 原文

~没有更多了~