Translate

lunedì 10 febbraio 2014

jQuery Mobile 1.4 codice standard per le pagine

Di seguito il codice standard per una pagina in jQuery Mobile 1.4 (la nuovissima versione di questo interessante framework).

Le novità sono molte e nei prossimi post vi parlerò nel dettaglio della nuova sintassi e di come realizzare le proprie pagine in modo che siano compatibili con questa nuova update.

La nuova versione ha risolto problemi di compatibilità con versioni più vecchie dei browser "desktop" (explorer in particolare, che rimane un osso duro quando si vuole visualizzare correttamente le pagine) e ha aggiunto nuove utili funzionalità oltre che bugfix vari che migliorano la performance delle pagine.

E' stato fatto, tra l'altro, un lavoro di "alleggerimento" per cercare di ottenere tempi di caricamento più rapidi.

Da notare il charset ISO-8859-1 che è consigliabile per caratteri vari accentati in Italiano, preferibile all'UTF-8.

<!DOCTYPE html>   
<html>   
<head>   
<title>Pagina in jQuery Mobile 1.4.0</title>  
<meta charset="ISO-8859-1"><!--per html5-->  
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1"><!-- pre-html5 -->  
<meta name="viewport" content="width=device-width, initial-scale=1">   
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />  
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>  
<script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>  
</head>  
<body>  
<div data-role="page">  
<div data-role="header">  
<h1>Page Title</h1>  
</div><!-- /header -->  
<div role="main" class="ui-content">  
<p>Page content goes here.</p>  
</div><!-- /content -->  
<div data-role="footer">  
<h4>Page Footer</h4>  
</div><!-- /footer -->  
</div><!-- /page -->  
</body>  
</html>  

NB i link a fogli di stile CSS e javascript necessari puntano direttamente a jquery.com, per cui non è necessario ospitare sul proprio server nessuno di questi file.

Si tratta di una pagina di base senza CSS personalizzati nè temi aggiuntivi, ed è utile per chiunque voglia avere immediatamente pagine perfettamente funzionanti senza dover ospitare nel proprio sito i vari .css e .js, senza rischiare di perdersi nei path dei vari file e cartelle, con tutti i problemi che ne derivano.

Nessun commento:

Posta un commento