disign.it | Jquery mobile: struttura | a digital sign for a best design!
A digital sign for a best design
Javascript 4.333 visualizzazioni

Jquery mobile: struttura

14/06/2013

Un primo semplicissimo esempio di formattazione per device mobile usufruendo dei preset di Jquery mobile, libreria formidabile che se ben utilizzata permette lo sviluppo di Apps complesse.

Come si vede dal listato di esempio utilizziamo una struttura con header e footer fruedo dei CSS di Jquery.

Partendo da questa base possiamo integrare regole di CSS personalizzate per raggiungere facilmente effetti e presentazioni idonee alle nostre scelte grafiche.

La documentazione completa su Jquery mobile la trovate qui.

 

‹!DOCTYPE html›

‹html›

‹head›

‹title›Layout mobile‹/title›

‹meta name="viewport" content="width=device-width, initial-scale=1"›

‹link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile.structure-1.3.1.min.css" /›

‹script src="http://code.jquery.com/jquery-1.9.1.min.js"›‹/script›

‹script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"›‹/script›

‹/head›

‹body›

 

‹div data-role="page"›

 

‹div data-role="header"›

‹h1›Benvenuto‹/h1›

‹/div›

 

‹div data-role="content"›

‹p›Testo introduttivo qui‹/p›

‹/div›

 

‹div data-role="footer"› ‹h3›‹i›Copyright dominio.tld‹/i›‹/h3› ‹/div›

 

‹/div›

 

‹/body›

‹/html›

← HTML5: spellcheck HTML5: i campi di tipo input →

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 

© 2009 - 2017 Impronte digitali di Luca Frassineti. Tutti i diritti riservati.