das nervt…. Auf einer Seite ist eine Google-Map eingebunden. Funktioniert bestens – ABER, wenn der Benutzer mit der Maus (Mausrad) scrollt und in den Map-Bereich gelangt, dann gibts ne Riesen-Zoomerei.
das kann vermieden werden mit:
<div class="map-wrap">
<div class="overlay" onClick="style.pointerEvents='none'"></div>
<iframe class="map" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d5424.971764998638!2d8.294026668792464!3d47.167922726068724!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x479002b7e09d4a1b%3A0xf865138a071382d1!2sEichenweg+4%2C+6280+Hochdorf!5e0!3m2!1sde!2sch!4v1461835851289" width="600" height="450" frameborder="0" allowfullscreen="allowfullscreen">
</iframe>
</div>
und folgendem CSS-Code:
/* google maps enable mouse scrolling */
.map { width:100%; height:450px; }
.map-wrap { position:relative; }
.overlay {
width:100%;
min-height:450px;
position:absolute;
top:0; }
Nach dem erstmaligen reinclicken in die Karte wird die Zoom-Möglichkeit freigegeben.
Beispiel gefällig? Hier: tierarztpraxis-eberli.ch/kontakt/