0

I know the topic was adressed alredy, but I am trying to come up with my own solution and I dont see why it doesnt work. Any advices will be appreciated.

HTML:

    <section class="map" id="map">
    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d640.0242065261922!2d14.422763000000002!3d50.084474!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x470b94ec3c31c091%3A0x9ad699d70874bab9!2sAteli%C3%A9r+Triton!5e0!3m2!1scs!2scz!4v1427795367306" width="100%" height="500" frameborder="0" class="no-interact" style="border:0"></iframe>

CSS:

 .no-interact {
    pointer-events: none;
 }

jQuery:

$(document).ready(function(){
    $("#map").click(function(){
       $("#map").removeClass("no-interact");
    });

    $("#map").mouseleave(function(){
      $("#map").addClass("no-interact");
    });
});

CSS class normaly works and disables scrolling of map, which is embedded on web page. But when I click on it, nothing happens. Is something wrong with the jquery code?

Nishit Maheta
  • 6,021
  • 3
  • 17
  • 32
Martin Trabalik
  • 17
  • 3
  • what are you trying to achieve? – knitevision Apr 04 '15 at 10:40
  • ``pointer-events: none;`` is doing what is has to, removing an element from being target to ANY ``mouse event``. So how do you want to attach a mouse event on an element, which you made not available for ``mouse events``. – knitevision Apr 04 '15 at 10:44
  • In the previous discussion, http://stackoverflow.com/questions/24768772/prevent-a-google-maps-iframe-from-capturing-the-mouses-scrolling-wheel-behavior#26890673, there was a layer on top of the map to catch the mouse events. – brenzy Apr 04 '15 at 11:43
  • Thanks Brenzy, it works through another layer on top of the map. I was trying to enable/disable zooming of map of course... – Martin Trabalik Apr 06 '15 at 11:11

1 Answers1

0

google map has its own click event handlers. Try to use Google Maps JavaScript API instead iframe, it has api for custom events binding. https://developers.google.com/maps/documentation/javascript/reference#MapsEventListener

khv2online
  • 100
  • 1
  • 7