Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

[AndroidOS 4.04] Pop up Dialog's overlay-theme Does not work with fixed bars #4874

Closed
takuyasato opened this Issue · 4 comments

4 participants

@takuyasato

Hi,
The overlay-theme of Pop-up Dialog in JQuery Mobile 1.2 does not work properly with a fixed menu bars at the bottom, on Android 4.04 Browsers.

It looks as though, the fixed bar at the bottom shows in front of the popup dialog,
causing the popup dialog itself to be darkened the the overlay-theme.

It works fine on iOS and Android 2.3 browsers.

My testing environment is as follows,

JQuery Mobile 1.2.0 alpha
JQuery 1.7.1

Android 4.0.4 (Galaxy Nexus)
Using preinstalled Browser

Thank you in advanced!

@mrextreme

I think I ran into the same problem on a Galaxy Note with Android 4.0.4 and stock browser. The popup "opens", the page becomes faded ( opaque overlay of the popup works ), but the popup window itself is not shown. If I tap on the background (outside of the popup - if it was there), then it closes as it should. JQM 1.2.0 a1, jQ 1.8.0

normal screen: http://i48.tinypic.com/34e2ulu.jpg
popup: http://i45.tinypic.com/3g6mc.jpg

@toddparker

I just re-tested our docs examples that use overlays and they look fine on My Galaxy Nexus running 4.0.4. Can you confirm you're seeing this issue here:
http://jquerymobile.com/test/docs/pages/popup/index.html

If not, then you might want to check your code. Is the popup inside the page container?

@takuyasato

Hi, thank you for your comment.

Can you confirm you're seeing this issue here:
http://jquerymobile.com/test/docs/pages/popup/index.html

My guess is that this issue occurs only when the page have fixed footers at the bottom.

If not, then you might want to check your code. Is the popup inside the page container?

Popup is written inside the page container.

Thank you in advanced!

@mrextreme

The exact same code I use works on 2.x Android, only 4.x acts up. I think the tester said it also works on iOS. I will let you know about that.

<div data-role="page" id="page-map" data-theme="b">
    <div data-role="header" data-tap-toggle="false" data-position="fixed" data-theme="b">
        <a href="#" data-icon="arrow-l" id="page-map-back-btn">Back</a>
        <h1 id="map_type_header"></h1>
    </div>

    <div data-role="content">
        <div id="map-canvas"></div>
    </div> <!-- content -->

    <div data-role="footer" data-tap-toggle="false" id="page-map-footer" data-position="fixed" data-theme="c">
    </div><!-- footer -->

    <div data-role="popup" id="taxi-info-popup" data-overlay-theme="a" data-theme="c" class="ui-corner-all">
        <a href="#" data-rel="back" data-role="button" data-theme="b" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
        <div data-role="header" data-tap-toggle="false" data-theme="b" class="ui-corner-top">
            <h1>Taxi Details</h1>
        </div>
        <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content">
            <p id="taxi-info-popup-content"><p>
            <a id="tipc-call-driver" href="#" data-theme="c" data-role="button">Call Driver</a>
        </div>
    </div> <!-- taxi-info-popup -->
</div> <!-- page-map -->
@Wilto Wilto was assigned
@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
@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
@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.