Monday, October 15, 2012

Android browser + position:fixed + maps = pain

Here are two test cases that have made me cringe lately:

You'll need to try it on the Android browser.

This one is with Bing Maps:
http://urloritdidnthappen.appspot.com/render/254001

and this one with Google:
http://urloritdidnthappen.appspot.com/render/288001

See the big red rectangle with position:absolute hovering on the map?

Notice how with position: fixed in the header that thing disappears?

I suspect some sort of z-index tomfoolery going on, which probably doesn't bode super well for the performance of position: fixed on Android. We can only hope for the day when ChromeWebView becomes available to us HTML5 app developers.