Pages enfant
  • Formations jQuery UI, jQuery Mobile

Comparaison des versions

Légende

  • Ces lignes ont été ajoutées. Ce mot a été ajouté.
  • Ces lignes ont été supprimées. Ce mot a été supprimé.
  • La mise en forme a été modifiée.
Commentaire: Migrated to Confluence 4.0

Clever Institut organise des formation jQuery UI et jQuery Mobile, voici le programe des deux formations (sur 5 jours chacunes...) :

JQuery & jQuery UI

JOUR 1
La philosophie de jQuery
Installation de jQuery
Objet jQuery
$ comme raccourci
Chainage des méthodes
Propriétés et méthodes de l'objet jQuery
Propriétés et méthodes de l'objet retourné par jQuery ()
Philosophie générale de jQuery
Méthodes utilitaires
Manipulation d'objets
Méthodes booléennes
Manipulation de tableaux
Manipulation de chaines de caractères
Autres propriétés et méthodes
Sélecteurs
De l'importance des sélecteurs
Sélecteurs simples
Sélecteurs d'attributs
Sélecteurs de classe
Sélecteurs d'id
Pseudo-classes
Pseudo-classes liées aux formulaires
Combinateurs
Sélecteurs multiples
Exemples utilisant les sélecteurs
Accéder au DOM
Document Object Model : rappels JavaScript
Différentes formes de la fonction jQuery ()
Méthodes d'accès au DOM
Exemples d'utilisation des méthodes

JOUR 2
Manipuler le DOM
Parcours des éléments de la collection
Méthodes gérant les attributs et propriétés
Méthodes gérant les classes CSS
Méthodes gérant le style
Méthodes gérant les dimensions
Méthodes gérant la position
Méthodes gérant le contenu
Méthodes d'insertion dans le DOM
Autres méthodes de gestion du DOM
Gestion des événements
Gestion des événements : rappels JavaScript
Méthode bind (eventName, callback)
Paramètre event
Transmettre d'autres paramètres à un événement
Evénements utilisables dans bind ()
Méthode unbind () : supprimer un gestionnaire d'événement
Autres méthodes
Utiliser des catégories dans les noms d'événements
Exemples d'utilisation des événements

JOUR 3
Ajax
Principe de base
Mise en place d'un serveur
Méthode $.ajax (options)
Méthode load (url, data, success)
Evénements Ajax
Effets visuels
Effets visuels standards définis par jQuery
Enchainements d'effets standards
Créer ses propres effets visuels avec jQuery
Enchainement d'effets avec animate ()
Gérer la file d'attente des effets visuels
Créer un plugin jQuery
Objectifs d'un plugin
Ajouter de nouvelles méthodes à l'objet jQuery
Ajouter de nouvelles méthodes aux objets de classe jQuery
Ajouter de nouvelles pseudo-classes
Diffuser un plugin

jQuery UI (2 jours)

JOUR 4
Introduction à jQuery UI
Installation de jQuery UI
Aperçu de jQuery UI
C'est quoi un thème CSS ?
Quels fichiers inclure dans nos pages HTML ?
Changer de thème CSS
Onglets dans la page
Principe de base
Mise en forme du contenu
Méthode tabs ()
Gestion des événements dans les onglets
Exemple d'utilisation des onglets
Menus en accordéon
Principe de base
Mise en forme du contenu
Méthode accordion ()
Gestion des événements dans les menus
Exemples d'utilisation des menus en accordéon
Boites de dialogue
Principe de base
Mise en forme du contenu
Méthode dialog ()
Gestion des événements dans les boites de dialogue
Exemples d'utilisation des boites de dialogue

JOUR 5
Boutons dans la page
Principe de base
Mise en forme du contenu
Méthode button ()
Gestion des événements sur les boutons
Boutons radio
Cases à cocher
Exemple d'utilisation des boutons
Barres de progression
Principe de base
Mise en forme du contenu
Méthode progressbar ()
Gestion des événements dans les barres de progression
Exemple d'utilisation des barres de progression
Sliders
Principe de base
Mise en forme du contenu
Méthode slider ()
Gestion des événements sur les sliders
Exemple d'utilisation des sliders
Calendriers
Principe de base
Mise en forme du contenu
Méthode datepicker ()
Gestion des événements sur les calendriers
Exemples d'utilisation des calendriers
Auto-complétion
Principe de base
Mise en forme du contenu
Méthode autocomplete ()
Gestion des événements sur les listes de suggestions
Exemple d'utilisation du mécanisme d'auto-complétion
Drag & drop
Méthode draggable ()
Gestion des événements sur les éléments déplacés
Exemples d'utilisation de la fonctionnalité de drag
Méthode droppable ()
Gestion des événements sur les éléments de dépôt
Exemples d'utilisation de la fonctionnalité de drop

Développement avec JQuery Mobile?

Installation de jQuery Mobile
Installation d'un serveur web?
Attributs HTML utilisés par jQuery Mobile?
Paramétrages spécifiques iPhone

Afficher des fenêtres
Une première fenêtre
Pages et fenêtres : définissons les termes employés
Passer d'une fenêtre à l'autre
Utiliser les transitions entre les fenêtres
Fenêtres superposées
Utiliser les thèmes CSS

Afficher des listes
Une liste simple
Une liste contenant des liens
Une liste numérotée contenant des liens
Insérer des séparateurs dans les listes
Listes imbriquées
Rechercher dans une liste
Afficher un compteur dans un élément de liste
Inclure une image 80x80 dans les éléments de liste
Inclure une image 20x15 dans les éléments de liste
Personnaliser les listes
Utiliser les thèmes CSS

Afficher des boutons
Définir un bouton
Que deviennent les anciens boutons définis par HTML ?
Associer une icône à un bouton
Définir un bouton sous forme d'icône (sans texte)
Définir la largeur du bouton
Juxtaposer les boutons verticalement
Juxtaposer les boutons horizontalement
Personnaliser les boutons
Utiliser les thèmes CSS

Afficher des données sous forme de tables
Un tableau sur deux colonnes
Un tableau sur plusieurs colonnes
Plusieurs lignes dans le tableau
Insérer des boutons dans les tableaux
Personnaliser les tableaux
Utiliser les thèmes CSS

Afficher les éléments de formulaires
Champs de saisie
Listes de sélection
Cases à cocher
Boutons radio
Interrupteurs
Sliders
Calendriers
Mieux disposer les éléments sur l'écran
Utiliser les thèmes CSS
Et si on veut conserver l'aspect d'origine des éléments ?

Afficher les barres d'outils
Barres d'outils "header" et "footer"
Barres d'outils de type fixe
Gérer les fenêtres en mode fullscreen
Créer des boutons dans une barre d'outils "header"
Créer des boutons dans une barre d'outils "footer"
Utiliser les barres de navigation
Insérer des icônes dans les barres de navigation
Utiliser les thèmes CSS

Conventions de jQuery Mobile
Initialisation de jQuery Mobile
Options de configuration
Utilisation des namespaces
Evénements virtuels

Manipuler les fenêtres
Gérer les attributs des liens
La méthode $.mobile.changePage (to, transition, reverse, changeHash)
Autres méthodes
Gérer les événements sur les fenêtres
Personnaliser les fenêtres
Exemples de manipulation des fenêtres

Manipuler les listes
Créer dynamiquement une liste
Transformer une liste HTML en une liste jQuery Mobile
Créer dynamiquement une fenêtre contenant une liste
Récupérer une liste par Ajax
Insérer un élément dans une liste
Supprimer un élément dans une liste
Gérer les événements sur les listes
Personnaliser les listes
Exemples de manipulation des listes

Manipuler les boutons
Créer dynamiquement un bouton
Transformer un élément HTML en un bouton jQuery Mobile
Insérer des boutons par Ajax
Gérer les événements sur les boutons
Personnaliser les  boutons
Exemples de manipulation des boutons

Manipuler les données sous forme de tables
Créer dynamiquement un tableau
Transformer un élément HTML en un tableau jQuery Mobile
Insérer des tableaux par Ajax
Insérer dynamiquement une nouvelle colonne
Insérer dynamiquement une nouvelle ligne
Gérer les événements sur les tableaux
Personnaliser les tableaux
Exemple de manipulation des tableaux

Manipuler les champs de saisie
Créer dynamiquement un champ de saisie
Transformer un élément HTML en champ de saisie jQuery Mobile
Insérer des champs de saisie par Ajax
Affecter et récupérer la valeur inscrite dans un champ de saisie
Gérer les événements sur les champs de saisie
Personnaliser les champs de saisie
Exemples de manipulation des champs de saisie

Manipuler les listes de sélection
Créer dynamiquement une liste de sélection
Transformer un élément HTML en une liste de sélection jQuery Mobile
Insérer une liste de sélection par Ajax
Ouvrir et fermer une liste de sélection
Affecter et récupérer les éléments sélectionnés dans une liste de sélection
Insérer et supprimer des éléments dans une liste de sélection
Gérer les événements sur les listes de sélection
Personnaliser les listes de sélection
Exemples de manipulation des listes de sélection

Manipuler les cases à cocher
Créer dynamiquement des cases à cocher
Transformer un élément HTML en une case à cocher jQuery Mobile
Insérer des cases à cocher par Ajax
Affecter et récupérer la valeur d'une case à cocher
Insérer et supprimer une case à cocher dans une liste existante
Gérer les événements sur les cases à cocher
Personnaliser les cases à cocher
Exemples de manipulation des cases à cocher

Manipuler les boutons radio
Créer dynamiquement des boutons radio
Transformer un élément HTML en un bouton radio jQuery Mobile
Insérer des boutons radio par Ajax
Affecter et récupérer la valeur d'un bouton radio
Insérer et supprimer un bouton radio dans une liste existante
Gérer les événements sur les boutons radio
Personnaliser les boutons radio
Exemples de manipulation des boutons radio

Manipuler les interrupteurs
Créer dynamiquement un interrupteur
Transformer un élément HTML en un interrupteur jQuery Mobile
Insérer des interrupteurs par Ajax
Affecter et récupérer la valeur d'un interrupteur
Gérer les événements sur les interrupteurs
Personnaliser les interrupteurs
Exemples de manipulation des interrupteurs

Manipuler les sliders
Créer dynamiquement un slider
Transformer un élément HTML en un slider jQuery Mobile
Insérer des sliders par Ajax
Affecter et récupérer la valeur d'un slider
Gérer les événements sur les sliders
Personnaliser les sliders
Exemples de manipulation des sliders

Manipuler les menus en accordéon
Créer dynamiquement un menu en accordéon
Transformer un élément HTML en un menu en accordéon jQuery Mobile
Insérer des menus en accordéon par Ajax
Gérer les événements sur les menus en accordéon
Personnaliser les menus en accordéon
Exemples de manipulation des menus en accordéon

Manipuler les barres d'outils
Créer dynamiquement une barre d'outils
Transformer un élément HTML en une barre d'outils jQuery Mobile
Insérer des barres d'outils par Ajax
Gérer les événements sur les barres d'outils
Personnaliser les barres d'outils
Exemples de manipulation des barres d'outils

Bases de données côté client
Stockage permanent et stockage dans la session
Utilisation d'une base de données

Cartes Google Maps
Intégrer une carte Google Maps dans l'application

GPS
Utiliser le GPS dans une application web