mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-04-10 17:31:02 +00:00
[455] Am now setting the min-height of a page so that the address bar can always be hidden on a silent scroll. This helps our transitions feel smoother as the page does not jump down if the page is not taller then 100% of the window. On orientation change we also update this value.
This commit is contained in:
parent
378fb51225
commit
d3077b491c
2 changed files with 14 additions and 0 deletions
|
|
@ -105,6 +105,14 @@ $(document).bind("mobileinit.htmlclass", function(){
|
|||
//add orientation class to HTML element on flip/resize.
|
||||
if(event.orientation){
|
||||
$html.removeClass( "portrait landscape" ).addClass( event.orientation );
|
||||
//Set the min-height to the size of the fullscreen. This is to fix issue #455
|
||||
if( event.orientation === 'portrait' ) {
|
||||
$( '.ui-page' ).css( 'minHeight', ( screen.availHeight >= screen.availWidth ) ? screen.availHeight : screen.availWidth);
|
||||
} else {
|
||||
$( '.ui-page' ).css( 'minHeight', ( screen.availHeight <= screen.availWidth ) ? screen.availHeight : screen.availWidth);
|
||||
}
|
||||
|
||||
$.mobile.silentScroll();
|
||||
}
|
||||
//add classes to HTML element for min/max breakpoints
|
||||
detectResolutionBreakpoints();
|
||||
|
|
|
|||
|
|
@ -37,6 +37,12 @@ $.widget( "mobile.page", $.mobile.widget, {
|
|||
if ( this._trigger( "beforeCreate" ) === false ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if( $( "html" ).hasClass( 'portrait' ) ) {
|
||||
$elem.css( 'minHeight', ( screen.availHeight >= screen.availWidth ) ? screen.availHeight : screen.availWidth);
|
||||
} else {
|
||||
$elem.css( 'minHeight', ( screen.availHeight <= screen.availWidth ) ? screen.availHeight : screen.availWidth);
|
||||
}
|
||||
|
||||
//some of the form elements currently rely on the presence of ui-page and ui-content
|
||||
// classes so we'll handle page and content roles outside of the main role processing
|
||||
|
|
|
|||
Loading…
Reference in a new issue