Introduction à la gestion des événements de défilement
Objectifs
L'objectif de cette vidéo est de :
- Apprendre à détecter les actions de défilement de la molette de la souris
- Comprendre comment piloter un scénario d'animation en fonction du défilement
- Optimiser l'expérience utilisateur en ajustant la vitesse et le comportement de l'animation
Résumé
Découvrez comment contrôler une animation de personnage en utilisant les événements de défilement de la souris. Ce tutoriel couvre les systèmes de détection de la molette, la lecture bidirectionnelle d'un scénario d'animation et l'optimisation des performances.
Description
Dans ce tutoriel, nous partons d'un fichier de départ intégrant une animation de personnage. Nous allons ajouter un script pour détecter les actions de défilement de la molette de la souris et piloter l'animation en conséquence.
La fonction JavaScript Moleting sera au cœur de ce processus et nous ferons en sorte qu'elle fonctionne aussi bien sur Chrome que sur Firefox. La vidéo explique comment utiliser des conditions pour déterminer le sens de défilement et adapter l'animation en conséquence. Nous verrons également comment éviter l'animation en boucle pour obtenir un comportement plus naturel.
Pour conclure, quelques astuces pour ajuster la vitesse de l'animation et optimiser l'expérience utilisateur seront partagées.
Questions - réponses
Programme détaillé
Module 1 - Filtrage du navigateur
Module 2 - Créer une page avec parallaxe souris
Module 3 - Créer une page avec parallaxe au scroll
Module 4 - Piloter le scénario d'un Clip à la molette
Module 5 - Piloter le scénario d'un Clip au clavier
