Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
…chive#4874 — Prevents ICS native browser from appearing to render the popup overlay above the popup when a position: fixed element exists on the page.
  • Loading branch information
Wilto authored and arschmitz committed Oct 16, 2012
1 parent 3153155 commit 55f027b
Show file tree
Hide file tree
Showing 3 changed files with 37 additions and 5 deletions.
5 changes: 5 additions & 0 deletions css/structure/jquery.mobile.popup.css
@@ -1,3 +1,8 @@
.ui-popup-open .ui-header-fixed,
.ui-popup-open .ui-footer-fixed {
position: absolute !important; /* See line #553 of popup.js */

}
.ui-popup-screen {
background-image: url(data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==); /* Necessary to set some form of background to ensure element is clickable in IE6/7. While legacy IE won’t understand the data-URI’d image, it ensures no additional requests occur in all other browsers with little overhead. */
top: 0px;
Expand Down
2 changes: 1 addition & 1 deletion docs/pages/popup/index.html
Expand Up @@ -47,7 +47,7 @@ <h2>Popup</h2>
<p>This will result in the following popup:</p>
<a href="#popupBasic" data-rel="popup" data-role="button" data-inline="true">Open Popup</a>

<div data-role="popup" id="popupBasic" data-overlay-theme="a">
<div data-role="popup" id="popupBasic">
<p>This is a completely basic popup, no options set.</p>
</div>

Expand Down
35 changes: 31 additions & 4 deletions js/widgets/popup.js
Expand Up @@ -494,8 +494,23 @@ define( [ "jquery",
},

_open: function( options ) {
var coords, transition;

var coords, transition,
androidBlacklist = ( function() {
var w = window,
ua = navigator.userAgent,
// Rendering engine is Webkit, and capture major version
wkmatch = ua.match( /AppleWebKit\/([0-9\.]+)/ ),
wkversion = !!wkmatch && wkmatch[ 1 ],
androidmatch = ua.match( /Android (\d+(?:\.\d+))/ ),
andversion = !!androidmatch && androidmatch[ 1 ],
chromematch = ua.indexOf( "Chrome" ) > -1;

// Platform is Android, WebKit version is greater than 534.13 ( Android 3.2.1 ) and not Chrome.
if( androidmatch !== null && andversion == 4.0 && wkversion && wkversion > 534.13 && !chromematch ) {
return true;
}
return false;
}());
// set the global popup mutex
$.mobile.popup.active = this;

Expand Down Expand Up @@ -535,9 +550,21 @@ define( [ "jquery",
.removeClass( "ui-selectmenu-hidden" )
.offset( coords );

// TODO: The fixed toolbars really only need to be hidden if the overlay has a background. Should this be conditional?
this._page.addClass( "ui-popup-open" );
if ( this.options.overlayTheme && androidBlacklist ) {
/* TODO:
The native browser on Android 4.0.X ("Ice Cream Sandwich") suffers from an issue where the popup overlay appears to be z-indexed
above the popup itself when certain other styles exist on the same page -- namely, any element set to `position: fixed` and certain
types of input. These issues are reminiscent of previously uncovered bugs in older versions of Android’s native browser:
https://github.com/scottjehl/Device-Bugs/issues/3
This fix closes the following bugs ( I use "closes" with reluctance, and stress that this issue should be revisited as soon as possible ):
https://github.com/jquery/jquery-mobile/issues/4816
https://github.com/jquery/jquery-mobile/issues/4844
https://github.com/jquery/jquery-mobile/issues/4874
*/
this.element.closest( ".ui-page" ).addClass( "ui-popup-open" );
}
this._animate({
additionalCondition: true,
transition: transition,
Expand Down

0 comments on commit 55f027b

Please sign in to comment.