OBJECTIF

Cette formation JQuery vous permettra de mettre en oeuvre et améliorer l’ergonomie et l’interactivité de vos sites afin d’optimiser leurs affichages sur les différents terminaux (ordinateur, tablette, mobile.).

PUBLIC CONCERNÉ

Cette formation s’adresse aux développeurs web, webmaster, webdesigners.

f

NIVEAU REQUIS

La maitrise du JavaScript, du HTML et des CSS est recommandé

DURÉE

3 jours

INFOS
  • Moyens pédagogiques et techniques : Formation personnalisée, sur site.
  • Intervenant : Formateur spécialisé, 20 ans d’expérience.
  • Validation : Attestation de fin de stage.

Programme de formation JQuery

 

Rappels sur les fondamentaux Javascript et CSS

Le DOM en Javascript
Syntaxe CSS
Les outils pour développer avec jQuery

Les principes de base de Jquery

• Inclusion de jQuery dans les pages
• Installation de la librairie
• Utiliser jQuery avec d’autres librairies.
• L’apport des modules dans Jquery (CSS, data)
• Travaux pratiques

Manipulations HTML avec jQuery

• Manipulations du code HTML (DOM jQuery)
• Insérer du contenu
• Ajouter du contenu à l’extérieur
• Cloner du contenu
• Remplacer du contenu
• Supprimer du contenu
• Manipulations du texte
• Manipulations des attributs
• Travaux pratiques

CSS et jQuery

• Manipulations des classes
• Manipulations en CSS
• Dimensions et positionnement
• Dimensions des objets
• Positionnement des objets
• Travaux pratiques

Événements

• Evénements Souris et clavier
• L’évènement de chargement de page (ready).
• Création d’événements et déclencheurs (bind, unbind, trigger…).
• Les fonctions d’événement prédéfinies (one, die, …).
• Événements dynamiques (Live)
• Travaux pratiques

Ajax

• Principes d’Ajax
• La fonction $.ajax
• La gestion des évènements AJAX
• La fonction $.post
• La fonction $.get avec réponse XML
• Les fonctions dédiées $.getJSON() et $.getScript()
• Travaux pratiques

Les plugins disponibles dans Jquery

• Aide contextuelle (qTip)
• Menu (SuckerFish)
• Galerie Photo (Lightbox)
• jQuery UI
• Liste déroulante
• Onglets
• Calendrier
• Drag and Drop
• Dialog
• Progress Bar
• Scroll Bar (slider)
• Travaux pratiques

 

 

 

Pin It on Pinterest

Share This