New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Popup issues on Android 4 ICS #4816

Closed
istrasoft opened this Issue Aug 7, 2012 · 11 comments

Comments

Projects
None yet
6 participants
@istrasoft

istrasoft commented Aug 7, 2012

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

This comment has been minimized.

Show comment
Hide comment
@toddparker

toddparker Aug 8, 2012

Contributor

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

Contributor

toddparker commented Aug 8, 2012

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

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Aug 8, 2012

Member

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

Member

jaspermdegroot commented Aug 8, 2012

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

@istrasoft

This comment has been minimized.

Show comment
Hide comment
@istrasoft

istrasoft Aug 9, 2012

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.

istrasoft commented Aug 9, 2012

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

This comment has been minimized.

Show comment
Hide comment
@xdumaine

xdumaine Aug 22, 2012

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 commented Aug 22, 2012

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.

@toddparker

This comment has been minimized.

Show comment
Hide comment
@toddparker
Contributor

toddparker commented Aug 23, 2012

@xdumaine

This comment has been minimized.

Show comment
Hide comment
@xdumaine

xdumaine Aug 27, 2012

@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

xdumaine commented Aug 27, 2012

@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

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Aug 27, 2012

Member

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

Member

jaspermdegroot commented Aug 27, 2012

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

@xdumaine

This comment has been minimized.

Show comment
Hide comment
@xdumaine

xdumaine Aug 28, 2012

Also related to #4874

xdumaine commented Aug 28, 2012

Also related to #4874

@ghost ghost assigned Wilto Aug 30, 2012

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Aug 30, 2012

Member

@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.

Member

jaspermdegroot commented Aug 30, 2012

@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.

@istrasoft

This comment has been minimized.

Show comment
Hide comment
@istrasoft

istrasoft Aug 30, 2012

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

istrasoft commented Aug 30, 2012

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

arschmitz added a commit to arschmitz/jquery-mobile that referenced this issue Oct 16, 2012

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.
@corytam

This comment has been minimized.

Show comment
Hide comment
@corytam

corytam Jan 8, 2013

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

corytam commented Jan 8, 2013

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment