Geek asks and answers

JQuery jScrollPane issue / conflict with Google maps on Safari

I seem to have encountered a strange error / conflict between jScrollPane and Google Maps (v3) when viewing in Safari.

The problem is that if I have an LI element inside my scrollbar for which the display is set to: block, as well as the google map on the page, the LI element will not scroll along with the rest of the content. Removing or simply hiding the google map on the page fixes the scroll problem.

I built a test case here. http://www.incontrolsolutions.com/scroll/stackoverflow.html

This page works correctly in FF, Chrome (Smooth like butter!) And even IE9

But Safari (including the webkit that accumulates every day until today) is choking.

Any understanding of what might be causing this, or possible workarounds, are welcome.

+1
source share
1 answer

Good question and great demo. I can play in Safari 5.0.5 on Snow Leopard, and this is really weird behavior.

I don’t know what causes the problem, but it seems that you can get around this by adding z-index: 999;CSS for the rule #RS_MapListPanel. If I make this change through the web inspector, then the page appears to be behaving correctly.

+3
source

More articles:


All Articles