Disable scroll wheel on Events Manager location maps

This post is more than 9 years old.

Events Manager is a really nice, easy to customise plugin for showing events on WordPress websites. One gripe I always have with it is that the location maps zoom when you use the mouse scroll wheel, something I always turn off when I add a map to a page. Here’s how to fix it.

Part of what makes Events Manager so easy to customise is that it provides lots of hooks for developers. One such hook is em_maps_location_hook, which it fires in the browser when a location map is loaded. It passes the Google Maps object so that you can do things with it, and that lets us change some map settings. All we need to do is add a little script to the bottom of a location page.

There’s a WordPress hook we can use to know when we’re on a location page too — em_location_output fires whenever a location is displayed, so we can use that to know when we need our little piece of JavaScript. Just add this to a small plugin or your theme’s functions.php file, and no more scroll wheel zooming!

/**
* add footer scripts hook when show location
* @param string $content
* @return string
*/
add_filter('em_location_output', function($content) {
    // add script to modify map behaviour
    add_action('wp_print_footer_scripts', 'em_location_map_scrollwheel');

    return $content;
});

/**
* script to disable the scroll wheel zoom on map
*/
function em_location_map_scrollwheel() {
    ?>

    <script>
    jQuery(document).bind("em_maps_location_hook", function(event, map) {
        map.setOptions({ scrollwheel: false });
    });
    </script>

    <?php
}

We can now scroll down the page without job being undone by the map grabbing the scroll wheel :)