diff --git a/js/jquery.mobile.fixHeaderFooter.native.js b/js/jquery.mobile.fixHeaderFooter.native.js index 0cd68763..7cc531fc 100644 --- a/js/jquery.mobile.fixHeaderFooter.native.js +++ b/js/jquery.mobile.fixHeaderFooter.native.js @@ -7,7 +7,11 @@ (function( $, undefined ) { -$.mobile.touchOverflowEnabled = true; +// Enable touch overflow scrolling when it's natively supported +$.mobile.touchOverflowEnabled = false; + +// Enabled zoom when touch overflow is enabled. Can cause usability issues, unfortunately +$.mobile.touchOverflowZoomEnabled = false; $( document ).bind( "pagecreate", function( event ) { if( $.support.touchOverflow && $.mobile.touchOverflowEnabled ){ diff --git a/js/jquery.mobile.init.js b/js/jquery.mobile.init.js index 36caca10..83f83bb3 100644 --- a/js/jquery.mobile.init.js +++ b/js/jquery.mobile.init.js @@ -103,6 +103,24 @@ } } }); + + // This function injects a meta viewport tag to prevent scaling. Off by default, on by default when touchOverflow scrolling is enabled + function disableZoom() { + var cont = "user-scalable=no", + meta = $( "meta[name='viewport']" ); + + if( meta.length ){ + meta.attr( "content", meta.attr( "content" ) + ", " + cont ); + } + else{ + $( "head" ).prepend( "", { "name": "viewport", "content": cont } ); + } + } + + // if touch-overflow is enabled, disable user scaling, as it creates usability issues + if( $.support.touchOverflow && $.mobile.touchOverflowEnabled && !$.mobile.touchOverflowZoomEnabled ){ + disableZoom(); + } // initialize events now, after mobileinit has occurred $.mobile._registerInternalEvents(); diff --git a/themes/default/jquery.mobile.core.css b/themes/default/jquery.mobile.core.css index 42dae9b3..c6a09085 100644 --- a/themes/default/jquery.mobile.core.css +++ b/themes/default/jquery.mobile.core.css @@ -35,6 +35,9 @@ -o-overflow-scrolling: touch; -ms-overflow-scrolling: touch; overflow-scrolling: touch; +} +.ui-page.ui-mobile-touch-overflow, +.ui-page.ui-mobile-touch-overflow * { /* some level of transform keeps elements from blinking out of visibility on iOS */ -webkit-transform: rotateY(0); }