Tuto publié par 
Avec ces tutos consacrés à jQuery mobile 1.0.1 et 1.1 d'une durée de 7H, vous apprendrez à maîtriser la création d'applications mobiles et de sites web mobiles HTML/CSS 100% compatibles avec de nombreuses plate-formes mobiles : iOS (iPhone, iPad, iPod touch), Android (mobile et tablettes), Blackberry, Symbian...
Vous découvrirez en détail et au travers d'exemples concrets la création de pages, de formulaires, de barres de navigations, les transitions animées, ainsi que l'ensemble des composants (widgets) fournis par jQuery mobile : boutons, interrupteurs, sliders, menus déroulants, listes, toolbars, controlgroup...
De la création d'icônes personnalisées compatibles "retina" à la mise en page par grille, ces tuto jQuery mobile abordent tous les détails indispensables et souvent ignorés qu'il faut prendre en compte pour réaliser des sites/app mobiles de qualité professionnelle.
Au terme de cette formation complète jQuery mobile, vous réaliserez une maquette d'application Twitter "JQMTweet" qui n'a rien à envier à une application "native".
Tous les fichiers sources des exemples sont fournis avec les tutos.
Bande Annonce de cette formation jQuery Mobile :
Jetez un oeil à ces autres tuto jQuery Mobile
Créer une Web App
Apprenez à créer une Webapp pour tablette et mobile. Une application…
Créer une Web App
Apprenez à créer une Webapp pour tablette et mobile. Une application…
Pour vous faire un avis, voici un extrait de quelques secondes. La version complète et téléchargeable de ce tuto jQuery Mobile de 7 heures 12 minutes est proposée dans une résolution plus grande que l’extrait suivant :
Regart.net
, Formateur
Regart.net Formation est un centre de formation agréé Adobe (AATC) et partenaire formation Microsoft Expression.
Spécialisé dans les domaines du multimédia, de la PAO, de la vidéo et du développement de sites et d'applications Web ou mobiles, Regart.net Formation met à disposition ses compétences et la qualité de ses apprentissages depuis 1998.
http://www.regart.net
Toutes les formations de Regart.net
Témoignage des clients de Regart.net
Très bon tuto, bon formateur!
spykrew07.Tuto et vidéo très bien réalisé et très bien expliqué.
Tutos clairs et concis, rien de mieux pour apprendre rapidement!
Je n'est fait qu'un tuto regart.net mais si d'autres m’intéressant arrivent je n'hésiterais pas ! La qualité est impécable et le formateur très agréable. Continuez !
Nouveau membre mais déja de bons tuto et gratuits en plus de ça. Efficaces, conçis, A recommander
D'autres tuto de Regart.net
Formation WordPress (cours complet)
Voici une formation Wordpress complète en vidéo, pour vous former à l’un des CMS…
Scroll vertical animé
Dans ce tuto jQuery en vidéo nous vous proposons de réaliser un système de scroll…
Introduction à l'animation dans le canvas
Dans ce tuto HTML5 gratuit, en vidéo, nous vous proposons une introduction à la création…
Création d'un accordéon jQuery
Dans ce tuto Jquery gratuit, nous réaliserons un menu accordéon en jQuery. La hauteur…
Notes attribuées par les utilisateurs (4 votes)
Les avis / Questions des utilisateurs (15)
Donnez votre avis ou posez une question au formateur.
Vous souhaitez commenter ce tuto vidéo ? Créez un compte gratuit. Déjà membre ? Identifiez-vous
Ce tuto en résumé ...
Ce tuto jQuery Mobile d’une durée de 7 heures 12 minutes a été acheté 98 fois et a reçu une note moyenne de 4/5.
Ce tuto a été publié le 17 avril 2012 par Regart.net, centre de formation, ayant reçu une note moyenne de 4,4/5 pour l’ensemble de ses vidéos.
Tous les fichiers sources sont fournis avec cette formation. Ces derniers vous permettront de reproduire les manipulations expliquées dans cette formation.
Ce tuto video vous expliquera étape par étape, toutes les manipulations présentées par le formateur.
Toutes nos vidéos sont visionnées par notre équipe, avant d’être mises en ligne, garantissant ainsi la qualité des produits téléchargés.
Choisissez parmi 32128 tuto classés dans nos 236 logiciels ou langages informatiques.
(a acheté ce tuto - 07 octobre 2012)
" long, long, lon pour expliquer des choses basiques "
(a acheté ce tuto - 02 août 2012)
" J’avance dans ce tuto. Le prix m’a fait un peu peur au départ mais ça les justifie. Le formateur explique très bien les différentes notions. Il n’est pas utile de connaître l’Ajax car c’est JQuery qui gère tout seul. A mon sens, il manque une petite explication sur le centrage des boutons par rapport à l’écran quand le data-inline est à true. Enfin, c’est du détail… "
(a acheté ce tuto - 08 juin 2012)
" Précis et détaillé ! Excellent pour une première prise en main. Vite, la suite !!! "
(a acheté ce tuto - 26 avril 2012)
" Bonjour, merci pour ton aide. c'est triste de ne pas pouvoir utiliser le 100%, c'est tellement plus simple. Bon j'attends avec impatience la suite de la formation ! ok pour orientationchange ; cependant, il faudra aussi prendre en compte le reconnaissance du device ; parce que dans mon cas, le 100% était utile pour quand on change l'orientation, mais aussi pour que d'un device à l'autre, ça fonctionne simplement. ça va faire pas mal de code à chaque fois, 2 tailles pour les devices, fois pour les orientations. c'est vraiment pénible de ne pas pouvoir mettre une taille en %... merci de ton aide. en attendant la suite. ;-) bien à toi ! "
(a acheté ce tuto - 26 avril 2012)
" excellant tuto ! Bien expliqué et très clair. Bravo "
(auteur de ce tuto - 26 avril 2012)
" Sisso,
1) Effectivement ton swf ne sera pas affiché sur mobile, à l'exception des devices Android. Mais si ton viewer propose un "fallback" JS, c'est très bien...
2) Le seul moyen de gérer cela est effectivement d'écouter avec JavaScript le changement d'orientation de l'écran et de redimensionner à la volée la div. Ce point sera abordé dans la seconde partie de la formation, consacrée au code JS et aux API de jQuery mobile.
Patience, elle devrait arriver bientôt.
En attendant, je te suggère de regarder du côté de "orientationchange" qui permet de gérer le changement d'orientation du device en JQM.
Bien à toi.
PS : n'hésite pas à mettre une note au tuto si tu l'as apprécié. C'est important pour nous d'avoir un retour ;) "
(a acheté ce tuto - 25 avril 2012)
" " si je "désactive" jquery, le contenu s'affiche parfaitement !! et en 100%. mais je n'ai plus les jolis styles et les belles transitions de jquery. j'ai lu sur internet (je ne suis pas le seul a être confronté au problème) qu'avec des javascript compliqué, on peut s'en sortir en créant des event pour modifier la taille de la div en fonction de l'orientation de l'ipad ou de l'iphone... mais ça fait pas mal de paramêtre, et je suis certain que le 100% peut marcher (doit marcher) ;-) je te donne le contenu de ma div au cas où :
<div data-role="content vv">
<div id="orsayDIV">
var viewer = createPanoViewer({swf:"krpano/krpano.swf",target:"orsayDIV", height:"683px"});
viewer.addVariable("xml", "orsay/krpano.xml");
viewer.embed();
</div>
</div>
ci tu as une solution, je serais ravi heureux et soulagé. ça fait un moment que je bloque dessus !
merci d'avance,
c'est l'état actuel..! l'idée serait de pouvoir remplacer height:"683px" par du 100% (au niveau de la div orsayDIV..
(et pas d'inquiétudes au niveau du swf, il y a du js qui prend le relais) ;-) " "
(auteur de ce tuto - 25 avril 2012)
" En principe, la div content a son style height sur "auto" par défaut : sa hauteur s'adapte au contenu automatiquement. Tu ne devrais pas avoir besoin de mettre à 100%. Le problème doit venir du contenu que tu affiches dedans. "
(a acheté ce tuto - 25 avril 2012)
" merci de la réponse rapide. il s'agit de la <div data-role="content">. cependant, j'ai testé à différents niveaux (la div qui contient la visite et dans le script même de la visite) et regardé un peu partout sur le net. il semblerai que le problème soit répandu... (même si les posts datent un peu)
lorsque je mets la taille height à 100%, rien ne s’affiche dans le content, et je me retrouve obligé de mettre le height en px, ce qui pose des problèmes évidents.
merci de ton aide. dis moi si je peux être plus précis. "
(auteur de ce tuto - 25 avril 2012)
" Bonjour sisso,
ça manque un peu de détail. Pourrais-tu préciser un peu le contexte ?
C'est sur la div 'content' que tu appliques ce style ?
Ou sur la div qui contient ta visite virtuelle ? "
(a acheté ce tuto - 25 avril 2012)
" " Bonjour, merci pour cette excellente formation ! Je suis néanmoins confronté à un problème. lorsque je passe mon contenu à style="height:100%", la div n'est pas prise en compte et rien ne s'affiche. Je suis obligé de passer le height en px, ce qui n'est pas pratique pour les changements d'orientations du device (portrait/landscape) ou le device lui-même (iphone/ipad). Comment pallier à ce problème ? (il s'agit d'afficher une div contenant une visite virtuelle)
merci d'avance " "
(auteur de ce tuto - 22 avril 2012)
" @Adel1982 :
Merci pour ton commentaire. La suite arrive, patience ;) "
(a acheté ce tuto - 21 avril 2012)
" C'est une excellente formation, j'attends la suite avec impatience :) "
(auteur de ce tuto - 19 avril 2012)
" Merci :)
Tu verras, tu ne seras pas déçu par la suite ! "
(n'a pas acheté ce tuto - 18 avril 2012)
" L'introduction donne envie. L'auteur a l'air de bien s'exprimer et de bien expliquer les choses. "