Skip to content

Commit 801e4aa

Browse files
author
scottjehl
committed
This backports the new fixedtoolbar plugin so that it works similarly on fix-blacklisted browsers like iOS4. With these files included, the toolbars will behave similarly to jQM 1.0 in browsers that don't support position:fixed properly, like iOS4.
1 parent a37efe8 commit 801e4aa

File tree

4 files changed

+76
-0
lines changed

4 files changed

+76
-0
lines changed
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/* fixed page header & footer configuration */
2+
.ui-faux-fixed .ui-header-fixed,
3+
.ui-faux-fixed .ui-footer-fixed {
4+
position: absolute;
5+
}
6+
.ui-header-fixed.ui-fixed-hidden {
7+
top: 0 !important;
8+
}
9+
.ui-footer-fixed.ui-fixed-hidden {
10+
bottom: 0 !important;
11+
}

css/structure/jquery.mobile.structure.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
@import url( "jquery.mobile.transitions.flow.css" );
1111
@import url( "jquery.mobile.grids.css" );
1212
@import url( "jquery.mobile.fixedToolbar.css" );
13+
@import url( "jquery.mobile.fixedToolbar.polyfill.css" );
1314
@import url( "jquery.mobile.navbar.css" );
1415
@import url( "jquery.mobile.button.css" );
1516
@import url( "jquery.mobile.collapsible.css" );

js/index.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
'jquery.mobile.controlGroup.js',
4747
'jquery.mobile.links.js',
4848
'jquery.mobile.fixedToolbar.js',
49+
'jquery.mobile.fixedToolbar.polyfill.js',
4950
'jquery.mobile.zoom.js',
5051
'jquery.mobile.zoom.iosorientationfix.js',
5152
'jquery.mobile.init.js'
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
2+
//>>description: Polyfilled behavior for "fixed" headers and footers in browsers that don't support position:fixed
3+
//>>label: Fixedtoolbar
4+
5+
define( [ "jquery", "./jquery.mobile.fixedToolbar" ], function( $ ) {
6+
//>>excludeEnd("jqmBuildExclude");
7+
(function( $, undefined ) {
8+
9+
var supportBlacklist = $.mobile.fixedtoolbar.prototype.options.supportBlacklist;
10+
11+
// If the browser is blacklisted for position:fixed support, polyfill it
12+
if( supportBlacklist() ){
13+
14+
// Add class for CSS hookage
15+
$( document.documentElement ).addClass( "ui-faux-fixed" );
16+
17+
// Make the blacklist test return false, letting any normally-blacklisted browsers in to be polyfilled
18+
$.mobile.fixedtoolbar.prototype.options.supportBlacklist = function(){ return false; };
19+
20+
// Per page show, re-set up the event handling
21+
$( document ).bind( "pagebeforeshow", function( e ){
22+
23+
var page = $( e.target ),
24+
fixies = page.find( ".ui-header-fixed, .ui-footer-fixed" ),
25+
visibleAtStart,
26+
resetPos = function(){
27+
fixies.each(function(){
28+
if( $(this).hasClass( "ui-header-fixed") ){
29+
$( this ).css( "top", $( window ).scrollTop() + "px" );
30+
}
31+
else {
32+
$( this ).css( "bottom", $.mobile.activePage.height() - $( window).scrollTop() - $.mobile.getScreenHeight() + "px" );
33+
}
34+
});
35+
};
36+
37+
// Normalize proper object for scroll event
38+
( ( $( document ).scrollTop() === 0 ) ? $( window ) : $( document ) )
39+
.bind( "scrollstart.fixed", function(){
40+
visibleAtStart = fixies.not( ".ui-fixed-hidden" ).fixedtoolbar( "hide", true );
41+
})
42+
.bind( "scrollstop.fixed", function(){
43+
resetPos();
44+
visibleAtStart.fixedtoolbar( "show" );
45+
});
46+
47+
// on resize, reset positioning
48+
$( window ).bind( "throttledresize.fixed", resetPos );
49+
50+
// on pagehide, unbind the event handlers
51+
page.one( "pagehide", function(){
52+
$( window ).add( this ).add( document ).unbind( ".fixed" );
53+
});
54+
55+
// align for pageshow
56+
resetPos();
57+
});
58+
}
59+
60+
})( jQuery );
61+
//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
62+
});
63+
//>>excludeEnd("jqmBuildExclude");

0 commit comments

Comments
 (0)