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

made some updates to fix support for globalnav plugin. Now you identify a globalnav with data-role="globalnav".

Browse source
This commit is contained in:
scottjehl 2010-09-17 18:44:55 -04:00
parent 779c79c917
commit abef220bef
4 changed files with 29 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
_globalnav.html
View file

@ -89,13 +89,13 @@
</div>
<div class="ui-globalnav">
<ul>
<li><a href="_containers-states.html" data-role="button">Containers</a></li>
<li><a href="_form-controls.html" data-role="button">Forms</a></li>
<li><a href="_transitions.html" data-role="button">Transitions</a></li>
<li><a href="_events.html" data-role="button">Events</a></li>
</ul>
<div data-role="globalnav">
<ul>
<li><a href="_containers-states.html" data-role="button">Containers</a></li>
<li><a href="_form-controls.html" data-role="button">Forms</a></li>
<li><a href="_transitions.html" data-role="button">Transitions</a></li>
<li><a href="_events.html" data-role="button">Events</a></li>
</ul>
</div>

32
js/jQuery.fixHeaderFooter.js
View file

@ -18,7 +18,7 @@ $.fn.fixHeaderFooter = function(options){
var o = $.extend({
transition: el.find('[data-headfoottransition]').attr('data-headfoottransition') || ['slidedown','slideup'],
//also accepts a string, like 'fade'. All animations work, but fade and slidedown/up look best
overlayOnly: el.find('.ui-fullscreen').length
overlayOnly: el.find('.ui-fullscreen').length || el.is('[data-role="globalnav"]')
},options);
//add transition and theme types
@ -71,12 +71,13 @@ $.fixedToolbars = (function(){
var fromTop = $(window).scrollTop(),
screenHeight = window.innerHeight,
thisHeight = thisel.parent().parent().height(),
thisTop = thisel.parent().parent().offset().top,
placeholder = thisel.parent().parent(),
thisHeight = placeholder.height(),
thisTop = placeholder.offset().top,
thisIsHeader = thisel.is('.ui-header');
if(partialVisibilityOkay){
return thisIsHeader ? (thisTop <= fromTop) : (thisTop + thisHeight > fromTop + screenHeight);
return thisIsHeader ? (thisTop <= fromTop) : (thisTop + thisHeight >= fromTop + screenHeight);
}
else {
return thisIsHeader ? (thisTop + thisHeight <= fromTop) : (thisTop > fromTop + screenHeight);
@ -115,18 +116,23 @@ $.fixedToolbars = (function(){
var els = allToolbars();
return els.each(function(){
var el = $(this),
partiallyCropped = placeHolderOutofView(el, true),
outofView = placeHolderOutofView(el),
overlayOnly = el.closest('.ui-headfoot-overlayonly').length;
//only animate if placeholder is out of view
if( placeHolderOutofView(el, true) ){
if( partiallyCropped || overlayOnly){
el.parent().addClass('ui-fixpos');
if( placeHolderOutofView(el) ){
el.addClass('in').animationComplete(function(){
el.removeClass('in');
});
}
}
//only animate if placeholder is out of view
if( outofView ){
el.addClass('in').animationComplete(function(){
el.removeClass('in');
});
}
if(overlayOnly){
el.parent().addClass('ui-fixpos');
el.parent().parent().removeClass('ui-headfoot-hidden');
}
el.trigger('setTop');

4
js/jQuery.globalnav.js
View file

@ -12,10 +12,10 @@ $.fn.globalnav = function(settings){
},settings);
//wrap it with footer classes
var globalnav = $(this).wrap('<div class="ui-bar-a"></div>').parent().addClass(o.fixedAs == 'footer' ? 'ui-footer' : 'ui-header');
var globalnav = $(this).wrapInner('<div class="ui-globalnav ui-bar-a"></div>').children(0).addClass(o.fixedAs == 'footer' ? 'ui-footer' : 'ui-header');
//apply fixed footer markup to ui-footer
$(document).fixHeaderFooter();
$(this).fixHeaderFooter();
//set up the nav tabs widths (currently evenly divided widths, to be improved later)
var navtabs = globalnav.find('li');

2
js/jQuery.mobile.js
View file

@ -255,7 +255,7 @@
//dom-ready
$(function(){
//global nav
$('.ui-globalnav').globalnav();
$('[data-role="globalnav"]').globalnav();
//mobilize all pages present
mobilize($('.ui-page'));