Okay, bear with me… I discovered an edge-case bug today. One which, best I can gather, occurs only in Safari, with users running OSX 10.6 (Snow Leopard). After finally tracking down what the problem was, I was amazed that the bug wasn’t better documented… that my Google searches hadn’t been more fruitful. Ergo, I’ve written it down here, and left comments open… so, if you’ve experienced the bug & found a workaround, please PLEASE let me/us know below.
The Setup:
Create a page with two divs, vertically-stacked.
Write a Flash swf to the top div (using swfobject… or any other embed method),
Insert a google map (using Google’s v3 API for Javascript) in the bottom div.
Should look like so:
Now… load the page up in your browser… then click and drag the map upwards (so as to reveal more southern content in the map)
If you’re running Apple OSX 10.6 and in Safari, you’ll notice that:
a.) your “hand” cursor quickly turns back to a normal “arrow” cursor.
b.) once you release the mouse button, the map is no longer draggable or clickable.
The map’s other navigation UI elements still work (i.e. you can use the controls to pan & zoom), but the map itself is completely unresponsive to mouse events.
Funny enough, you can use the UI to move the map north again, and actually re-enable mouse events on the map, but as soon as you drag south again, you’re hosed.
I just came across this buggery today, so unfortunately, I don’t have any workarounds yet. I’ve tried different Flash embed methods (SWFObject, Adobe’s old “AC” method, twice-baked), explicitly defining different z-indexes, but nothing seems to work yet.