Complete script for google map that will enable zoom on clicking in the map area only
<script type='text javascript' src="https://maps.googleapis.com/maps/api/js?key=&sensor=false&extension=.js">
<script type='text javascript'="">
jQuery(document).ready(function(){
var latitude = $('#map_latitude').val();
var longitude = $('#map_longitude').val();
// When the window has finished loading create our google map below
google.maps.event.addDomListener(window, 'load', init);
function init() {
// Basic options for a simple Google Map
// For more options see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions
var mapOptions = {
// How zoomed in you want the map to start at (always required)
zoom: 14,
// The latitude and longitude to center the map (always required)
center: new google.maps.LatLng(latitude,longitude),
//Disable scroll wheel by default,
scrollwheel: false,
// How you would like to style the map.
// This is where you would paste any style found on Snazzy Maps.
// Get the HTML DOM element that will contain your map
// We are using a div with id='map' seen below in the
var mapElement = document.getElementById('map');
// Create the Google Map using out element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
var marker = new google.maps.Marker({
map: map,
position: map.getCenter(),
icon: 'images/google-map-cion.png'
});
// Listen to click event on map and enable zoom
map.addListener('click', function() {
map.set('scrollwheel', true);
});
}
})
</script>
DEMO