Prevent map zoom on scroll

index.html

<div id="map-wrapper">
  <iframe id="map-canvas"></iframe>
</div>

main.js

// Iframe wrapper ID set to #map-wrapper
// Iframe ID set to #map-canvas

var wrapper = $('#map-wrapper');
var canvas = $('#map-canvas');

// Prevent map zoom on scroll
// Enable the pointer events only on click

// Disable pointer events on doc ready
canvas.addClass('scroll-off'); 

// Enable pointer events on wrapper click
wrapper.on('click', function () {
  canvas.removeClass('scroll-off'); 
});

// Disable pointer events when the mouse leaves the canvas
canvas.mouseleave(function () {
  canvas.addClass('scroll-off'); 
});

style.css

.scroll-off {
  pointer-events: none;
}