I have a page with some CSS animations. This page also has a map created using the Google Maps API.
Here you can see a demo:
http://dev.timmurtaugh.com/demo/projects-map-debug.html
If you click on the "Drag and Drop Size" link before you hover over the "Main Nav Item", you will see that the size of the resized item will change as expected.
However, as soon as you hover over the nav element, which should call the pop-up menu via CSS, not only does the flyout menu not appear, the "Toggle Size" link stops working.
As if it weren’t too strange, the web inspector believes that everything works fine - he reports that the window size changes when visually it is not.
I tried to isolate the map in an iframe, and get the same results.
This seems to only happen on Safari (5.1.5) / Mac, and not on any other browser that I tested (latest Chrome / Firefox / Internet Explorer 9).
I tried suggestions on this: jQuery jScrollPane problem / conflict with google maps in Safari
... and this: Mac Safari 5.0.4 error when using the Google Maps API
Is there anything I can do?
source
share