Question

我正在将Google Map Lite地图嵌入到我的网站中，并希望禁用滚动功能。

我找到了一个很好的解决方案，可以直接在地图上制作透明叠加层（请参阅下面的html和css）。

它在Chrome和Firefox中运行良好，但在Safari中只有地图所在的空白区域。有解决方案吗？

<html>
    <div class="overlay" onClick="style.pointerEvents='none'"></div>
    <iframe src="https://mapsengine.google.com/map/embed?mid=some_map_id" width="640" height="480"></iframe>
</html>

.overlay {
   background:transparent; 
   position:relative; 
   width:640px;
   height:480px; /* your iframe height */
   top:480px;  /* your iframe height */
   margin-top:-480px;  /* your iframe height */
}

感谢您的帮助！

Answer 1

将iframe 放在 div内（而不是在div之后）

<div class="overlay" onClick="style.pointerEvents='none'">>
    <iframe src="https://mapsengine.google.com/map/embed?mid=some_map_id" width="640" height="480"></iframe>
</div

谷歌地图叠加以禁用滚动功能在Safari中无效

1 个答案: