Dinevore在地图上使用带有链接的标记。要明白我的意思,看看这个链接,切换地图视图上: http://nyc.dinevore.com/restaurants/discover链接<a>使用Google Maps API V3在标记上叠加
在检查代码,它看起来像他们不使用谷歌地图标记的构造,而是使用原始跨度覆盖与定义的标记作为跨度的背景。这样做允许他们将其标记链接:
<span class="marker">
<a onclick="infoBoxPop[1].open(map)" style="color: white; cursor: pointer;">1</a>
</span>
这种方法的缺点是你失去所有的标记构造的好处如拖放和标记标记阴影效果动画。
是否有可能实现与Dinevore相同的效果,但在顶部使用带有叠加层的Google Maps标记构造函数?
我到目前为止所创建的问题是让链接的Z索引位于包含覆盖的div的z索引之上。
当Google地图渲染时,它首先渲染z-index为100的图块,然后渲染地图上的每个后续项目,例如叠加层,标记,标记阴影,比例滑块,Google徽标,地图源等等。随着这些后续项目中的每一个,Google都会增加Z-索引。
所以我得到
地图
-div
- 的z-index:100 - (一些相关的图块图像)
- 的z-index: 101 - 标签覆盖
-z-index:102 - 标记阴影覆盖
- z索引:103 - 标记图像重叠
- z索引:104 - (空)
- z索引:105 - gmnoprint(我不知道什么这是,但它涉及到标记)
- z索引:106 - (空)
- z索引:107 - 图块图像
-div
- z-index:12 - Google徽标
-div
- 的z-index:1000 - 源
反正让我的跨度标签与101的z-index股利来覆盖它的堆积情况和上面去101或是唯一的解决方案使用javascript hack将101更改为104?例如,通过选择父级并调整z-index?
我也有代码'分层'的问题。在某些情况下,我已经能够移动函数调用,并且API分别对元素进行分层。它是一种低技术解决方案,有时候起作用 – roberthuttinger 2013-06-20 16:18:40