jQuery Mobile è una fonte interessante per cercare di implementare nuove soluzioni per il mondo mobile. L'unico difetto di questa libreria è che, a differenza di jQuery UI, non è modulare, quindi è necessario analizzare il suo codice non compresso per estrapolare delle routine utili. Una di queste routine è la disabilitazione dello zoom sul dispositivo di riferimento. Vediamola in dettaglio.
Solitamente si utilizzano dei meta tag per impostare le preferenze di una web app. jQuery Mobile segue questo approccio:
function disableZoom() {
var cont = "user-scalable=no",
meta = $( "meta[name='viewport']" );
if( meta.length ){
meta.attr( "content", meta.attr( "content" ) + ", " + cont );
}
else{
$( "head" ).prepend( "<meta>", { "name": "viewport", "content": cont } );
}
}
Questo è un metodo privato della libreria, ma una volta estrapolato può essere riutilizzato in molti contesti. Verifica la presenza del meta tag viewport
ed imposta il suo valore su user-scalable=no
. Se il meta tag non è presente, lo crea da zero.