Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Popup issues on Android 4 ICS #4816

Closed
istrasoft opened this Issue · 11 comments

6 participants

@istrasoft

Hi all

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.

@toddparker

The popup should be inside the page wrapper. Are the docs exhibiting this issue on that device or just your code?

@jaspermdegroot
Collaborator

There is an outline 0 rule already for the popup container that gets focus.

@istrasoft

Here is a screenshot for the Firefox outline issue

Using Android ICS 4.0 and Firefox 14.0.1

http://i.imgur.com/QfDM5.png

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.

@xdumaine

I get the overlay-on-top-of-popup issue too, in ICS.

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.

@xdumaine

@toddparker yeah, but there's nothing with position fixed on that page. Position="fixed" is what is causing the issue. Searching around led me to believe it's an Android ICS bug only.

http://code.google.com/p/android/issues/detail?id=6721

@jaspermdegroot
Collaborator

Looks like issue #4844 is caused by the same bug.

@xdumaine

Also related to #4874

@Wilto Wilto was assigned
@jaspermdegroot
Collaborator

@istrasoft

About the Firefox outline issue. I cannot reproduce this on FF 15.0 on Android 4.0.4. Maybe it was a FF bug that has been fixed. Can you update the app and see if the issue still persists?

The other two issues are caused by z-index bugs in ICS (see also the two issues referenced in the previous comments). We are working on a solution for that.

@Wilto Wilto closed this issue from a commit
@Wilto Wilto Fixes #4816, fixes #4844, fixes #4874 — Prevents ICS native browser f…
…rom appearing to render the popup overlay above the popup when a position: fixed element exists on the page.
17eb661
@Wilto Wilto closed this in 17eb661
@istrasoft

@uGoMobi tried update, still 14.0.1 version and same issue, just FYI

@arschmitz arschmitz referenced this issue from a commit in arschmitz/jquery-mobile
@Wilto Wilto Fixes #4816, fixes #4844, fixes #4874 — Prevents ICS native browser f…
…rom appearing to render the popup overlay above the popup when a position: fixed element exists on the page.
55f027b
@corytam

Sorry for asking this , but how do I make a fix to the packaged version I'm using ?
Must I make my own custom build until the next version?
Thanks

@isoden isoden referenced this issue from a commit
Commit has since been removed from the repository and is no longer available.
@isoden isoden referenced this issue from a commit
Commit has since been removed from the repository and is no longer available.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.