Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-03-16 22:10:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added support for fullscreen data attr on pages. When present, child headers and footers will be absolute positioned and invisible when hidden

Browse source
This commit is contained in:
scottjehl 2010-10-05 16:08:11 -04:00
parent 0de4e457be
commit 83f6ff9eef
2 changed files with 12 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
css/jQuery.mobile.headerfooter.css
View file

@ -4,9 +4,9 @@
* Dual licensed under the MIT (MIT-LICENSE.txt) or GPL (GPL-LICENSE.txt) licenses.
*/
/* page header & footer configuration */
.ui-header, .ui-footer { position: absolute; z-index: 1000; overflow: hidden; width: 100%; }
.ui-header, .ui-footer, .ui-page-fullscreen .ui-header, .ui-page-fullscreen .ui-footer { position: absolute; z-index: 1000; overflow: hidden; width: 100%; }
.ui-page .ui-header, .ui-page .ui-footer { position: relative; }
.ui-footer-duplicate { display: none; }
.ui-footer-duplicate, .ui-page-fullscreen .ui-fixed-inline { display: none; }
.ui-header .ui-back { position: absolute; left: 10px; top: .4em; }
.ui-header h1, .ui-footer h1 { text-align: center; font-size: 16px; display: block; margin: .6em 90px .8em; padding: 0; white-space: nowrap; overflow: hidden; }
.ui-header .ui-aux { position: absolute; right: 10px; top: .2em; }

12
js/jQuery.mobile.fixHeaderFooter.js
View file

@ -7,8 +7,9 @@
(function($){
$.fn.fixHeaderFooter = function(options){
return $(this).each(function(){
$(this).find('.ui-header').addClass('ui-header-fixed fade'); //should be slidedown
$(this).find('.ui-footer').addClass('ui-footer-fixed fade'); //should be slideup
if( $(this).data('fullscreen') ){ $(this).addClass('ui-page-fullscreen'); }
$(this).find('.ui-header').addClass('ui-header-fixed ui-fixed-inline fade'); //should be slidedown
$(this).find('.ui-footer').addClass('ui-footer-fixed ui-fixed-inline fade'); //should be slideup
});
};
@ -106,6 +107,9 @@ $.fixedToolbars = (function(){
screenHeight = window.innerHeight,
thisHeight = el.outerHeight(),
alreadyVisible = (el.is('.ui-header-fixed') && fromTop <= thisTop + thisHeight) || (el.is('.ui-footer-fixed') && thisTop <= fromTop + screenHeight);
//add state class
el.addClass('ui-fixed-overlay').removeClass('ui-fixed-inline');
if( !alreadyVisible && !immediately ){
el.addClass('in').animationComplete(function(){
@ -119,6 +123,10 @@ $.fixedToolbars = (function(){
currentstate = 'inline';
return $('.ui-header-fixed,.ui-footer-fixed:not(.ui-footer-duplicate)').each(function(){
var el = $(this);
//add state class
el.addClass('ui-fixed-inline').removeClass('ui-fixed-overlay');
if(immediately){
el.css('top',0);
}