Unable to scroll inside InfoBox

[GoogleCodeExporter]

If the content of the InfoBox overflows, you can't use the scrollbar to scroll 
down because it will drag the map instead.

Any ideas? 

Original issue reported on code.google.com by mongopr...@gmail.com on 2 Jul 2010 at 9:38

[GoogleCodeExporter]

We solved this by replacing this line:
--------------------------------------
google.maps.event.addDomListener(closeImg, 'click', removeInfoBox(this));
--------------------------------------

With the following:

function stealClick_(e) {
    if(navigator.userAgent.toLowerCase().indexOf('msie') != -1 && document.all) {
        window.event.cancelBubble = true;
        window.event.returnValue = false;
    } else {
        e.stopPropagation();
    }
}
google.maps.event.addDomListener(closeImg, 'click', removeInfoBox(this));
google.maps.event.addDomListener(contentDiv, 'mousedown', stealClick_);

Original comment by mongopr...@gmail.com on 2 Jul 2010 at 12:41

[GoogleCodeExporter]

I'm sorry, but I can't find the line
google.maps.event.addDomListener(closeImg, 'click', removeInfoBox(this));
in the source code of infobox.js

Which source file are you using?

Original comment by garylitt...@gmail.com on 3 Jul 2010 at 5:34

[GoogleCodeExporter]

We were referring to the code found in the online demo:
http://gmaps-samples-v3.googlecode.com/svn/trunk/infowindow_custom/infowindow-cu
stom.html

Original comment by mongopr...@gmail.com on 4 Jul 2010 at 6:09

[GoogleCodeExporter]

has this issue been resolved?

I have been trying to just add: 
map.setOptions({draggable:false, scrollwheel:false});

when the infobox is opened.

Original comment by abeconna...@gmail.com on 10 Jul 2010 at 5:41

[GoogleCodeExporter]

The solution above listed on Jul 02, 2010 worked for us...

Have you tried to implement this change?

Original comment by mongopr...@gmail.com on 11 Jul 2010 at 2:33

[GoogleCodeExporter]

yes, I tried, but that code snippet is not in the latest release of the infobox 
code within this library.  

Take a look at the official release:
http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.0.2/

Original comment by abeconna...@gmail.com on 11 Jul 2010 at 2:59

[GoogleCodeExporter]

A slightly related problem is using the scroll wheel - when the map has scroll 
wheel zoom enabled, and the info box has overflows, moving the scroll wheel 
inside the info box causes the map to zoom. 

Looks like the infobox just needs to cancel some mouse events after i handles 
them... mostly click, move and scroll events.

Original comment by sudhi...@gmail.com on 2 Jan 2011 at 4:59

[GoogleCodeExporter]

I got it to work perfectly using jQuery 1.4 + and the "live" event :

jQuery(document).ready(function(){
    // Disable map Dragging when cursor enters infoBox div
    jQuery("#theinfoBox").live("mouseenter", function(){
        map.setOptions( {draggable:false} ); 
    })
    jQuery("#theinfoBox").live("mouseleave" , function(){
        map.setOptions( {draggable:true} ); 
    });
});

Original comment by benfa...@gmail.com on 2 Jan 2011 at 12:33

[GoogleCodeExporter]

The # selector is for id. There is no default id given for the infoBox div. A 
default class is assigned = "infoBox". So using the . selector in jQuery would 
make more sense, unless you modified the infoBox source code to include an id 
called "theinfoBox".

Either way I am having issues with jQuery even finding the div in both cases. 
Even when I use the chrome console and run $(".infoBox");, an empty array is 
returned. I've also tried using the IE developer tool bar and I've looked at 
the div where my infobox is located and the class does = "infoBox". 

Where are you putting that jQuery code? Right into the html page for the map?

Original comment by stevecou...@gmail.com on 20 Jun 2012 at 11:02

[GoogleCodeExporter]

Ok, so this works great for a desktop web-browser but when I try to scroll the 
infobox on a mobile device (i.e Android) i can't seem to get the event 
propagation right. I can get it to not pan the map but then it just scrolls the 
page and if I prevent the page from being scrolled when trying to scroll the 
infoBox (using e.preventDefault()) nothing scrolls but that includes the 
infoBox. 

It seems I can't get the scroll event to target the infoBox. Any ideas of how 
to work around this?

Original comment by benn.ma...@gmail.com on 30 Aug 2012 at 11:41

[GoogleCodeExporter]

even scroll does not work in infowindow.. we tested it on andriod 2.3 but it 
works fine in 4.0 version..

Original comment by sathis.s...@gmail.com on 18 Feb 2013 at 7:31

[GoogleCodeExporter]

we got stuck in disabling drag on infobox and zoom when we try to scrol on 
infobox.. 
we are using latest v3 infobox..

thanks..

Original comment by sathis.s...@gmail.com on 18 Feb 2013 at 7:38