I was having the same problem: when scrolling the page then the pointer becomes over the map, it starts to zoom in/out the map instead of continuing scrolling the page. :(
So I solved this putting a div
with an .overlay
exactly before each gmap iframe
insertion, see:
<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>
In my CSS i created the class:
.overlay {
background:transparent;
position:relative;
width:640px;
height:480px; /* your iframe height */
top:480px; /* your iframe height */
margin-top:-480px; /* your iframe height */
}
The div will cover the map, preventing pointer events from getting to it. But if you click on the div, it becomes transparent to pointer events, activating the map again!
I hope get helped you :)
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…