Popup issues on Android 4 ICS#4816

Labels

Milestone

Assignee

6 participants

on Android ICS 4.0 on Android Browser in my webapp the popups all appear shaded by the overlay specified by data-theme-overlay but the buttons and LIs remain clickable. It does not however happen on the same pages on Chrome or Firefox on the same phone. It also does not happen on the Popup Demo page in the Android Browser, so I am puzzled.

Does the Popup div have to be inside the div data-role="page" or outside or it does not matter ?

Unfortunately I have a hard time reproducing this in a jsfiddle...

Also, if the popup is displayed over a focused text field (can happen if popup is opened via JS), then the focused text field is displayed above the popup.

Last thing is on Firefox on Android 4, the popup div appears to be focused/selected after it is displayed, causing a very ugly yellow border to be displayed around it (the default Firefox selection color). Maybe a CSS rule could fix this.

Regarding the popup container being shaded by the overlay on Android Browser, there is not issue on the demo pages, and curiously enough if I apply the "position:fixed" style to the ui-popup-container, it then is displayed unshaded by the overlay. Very strange.

I've replicated the issue with this JS fiddle - http://jsfiddle.net/TpBQd/6/ the popup appears under the overlay in Android only. Notice that if you remove data-position="fixed" from the header, it doesn't happen.

istrasoft's workaround of applying position:fixed to the ui-popup-container works for ICS. The bug is fixed in JB.