Skip to content

Instantly share code, notes, and snippets.

@Wilto
Created October 30, 2012 21:05
Show Gist options
  • Save Wilto/3983059 to your computer and use it in GitHub Desktop.
Save Wilto/3983059 to your computer and use it in GitHub Desktop.
Prevents zoom when interacting with `select`/text inputs on iOS, from jQM. Tested in iOS 6 and below.
(function( $ ) {
var meta = $( "meta[name=viewport]" ),
initialContent = meta.attr( "content" ),
disabledZoom = initialContent + ",maximum-scale=1, user-scalable=no",
enabledZoom = initialContent + ",maximum-scale=10, user-scalable=yes",
disabledInitially = /(user-scalable[\s]*=[\s]*no)|(maximum-scale[\s]*=[\s]*1)[$,\s]/.test( initialContent );
$.zoom = {
enabled: !disabledInitially,
locked: false,
disable: function( lock ) {
if ( !disabledInitially && !$.zoom.locked ) {
meta.attr( "content", disabledZoom );
$.zoom.enabled = false;
$.zoom.locked = lock || false;
}
},
enable: function( unlock ) {
if ( !disabledInitially && ( !$.zoom.locked || unlock === true ) ) {
meta.attr( "content", enabledZoom );
$.zoom.enabled = true;
$.zoom.locked = false;
}
},
restore: function() {
if ( !disabledInitially ) {
meta.attr( "content", initialContent );
$.zoom.enabled = true;
}
}
};
// In many situations, iOS will zoom into the select upon tap, this prevents that from happening
$("select, input").bind( "touchstart", function() {
$.zoom.disable( true );
}).bind( "mouseup", function() {
setTimeout(function() {
$.zoom.enable( true );
}, 0);
});
}( jQuery ));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment