Introduction aux Transformations CSS 3D
Objectifs
Les objectifs de cette vidéo sont les suivants :
- Comprendre la structure HTML nécessaire pour créer une carte tournante.
- Apprendre à utiliser les propriétés de transformation et de perspective CSS 3D.
- Configurer et appliquer des transitions en jQuery pour animer la carte.
Résumé
Découvrez comment réaliser une carte tournante ou flipkart en utilisant des CSS 3D avancées et des transformations.
Description
Dans cette leçon, nous allons explorer la création d'une carte tournante en utilisant les technologies CSS 3D et jQuery. Nous commencerons par la structure du code HTML, comprenant un bloc carte avec deux faces: le recto et le verso. Ensuite, nous passerons aux styles CSS, où nous introduirons de nouvelles propriétés de transformation et de perspective comme Moz Perspective et WebKit transform. Nous allons également configurer les éléments front et back pour gérer la visibilité des faces arrière. Enfin, nous ajouterons une classe jQuery qui permettra de faire tourner la carte lorsque l'utilisateur clique dessus. Nous testerons différentes valeurs de perspective pour observer comment elles affectent la rotation de la carte.
Questions - réponses
Programme détaillé
Module 1 - Introduction à la formation HTML5 et CSS3 Part 4
Module 2 - Initiation javascript et jQuery
Module 3 - Déplacements et apparition
Module 4 - Gestion audio et video
Module 5 - Réaliser des menus
Module 6 - Présenter des images
Module 7 - Technologie Ajax
Module 8 - Les formulaires
Module 9 - Les images
Module 10 - Autres
Dommage que M Audoux ne va pas toujours au terme de ses exemples. Il manque souvent un petit "clic" qui finaliserait le cours.
Je rejoins le commentaire précédent, à savoir qu'il manque les fichiers de travail avec lesquels il serait plus facile de s'exercer.
Est il possible d'avoir les exemples afin de pouvoir travailler dessus et ne pas être obliger de jongler entre l'éditeur et la vidéo.
Merci.