Google Maps - Zoom unterdrücken

Oft kennt man das Problem: Man möchte ein großes Google Maps iframe einsetzen, dieses erschwert es aber oft dem User mit dem Mausrad herunterzuscrollen. Wenn Google Maps z.B. mit 100 %iger Breite eingesetzt wird, stellt dies ein gar unüberwindbares Scroll-Hindernis dar.

Gleiches Problem zeichnet sich auch am Handy ab.

Hierzu gibt es folgende Lösung:

Sie sehen den Code (netservice) für den Einbau auf der Webseite.

Einfach rote Teile durch grüne ersetzen bzw. ergänzen!

 

Problem:

<iframe

src="https://www.google.com/maps/embed?pb=!1m23!1m12!1m3!1d2713.216129315259!2d14.741511815860395!3d47.15362132715193!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m8!3e6!4m0!4m5!1s0x4771cc91b7669281%3A0x14935f27541bd209!2sErzherzog-Johann-Gasse+18%2C+Wei%C3%9Fkirchen+in+der+Steiermark!3m2!1d47.1536177!2d14.7437005!5e0!3m2!1sde!2sat!4v1467033619732" width="1920" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

 

Lösung:

<div id="gmap-holder">

<iframe style="pointer-events:none"

src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2713.2154502796634!2d14.741422915860417!3d47.15363462715093!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4771cc91b7669281%3A0xa81388bd05e742af!2snetservice+dienstleistung+GmbH%2C+Erzherzog-Johann-Gasse+18%2C+8741+Wei%C3%9Fkirchen+in+der+Steiermark!5e0!3m2!1sde!2sat!4v1459572722086" width="1920" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

</div>

<SCRIPT LANGUAGE= "javascript">

$(function() {

    $('#gmap-holder').click(function(e) {

        $(this).find('iframe').css('pointer-events', 'all');

    }).mouseleave(function(e) {

        $(this).find('iframe').css('pointer-events', 'none');

    });

})

</SCRIPT>

 

 

Add Feedback