CATALOGUE Code & Data Formation Animate CC Maîtriser Adobe Animate CC 2017 - Ateliers parallaxe Création d'un Effet Parallax avec JavaScript

Création d'un Effet Parallax avec JavaScript

Déclaration des variables de références
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Maîtriser Adobe Animate CC 2017 - Ateliers parallaxe
Revoir le teaser Je m'abonne
Transcription
Cette leçon fait partie de la formation
29,89€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
Cette leçon fait partie de la formation
29,89€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Introduction à la Fonctions Parallax

Objectifs

Les objectifs de cette vidéo sont :
1. Comprendre les bases de l'effet Parallax.
2. Apprendre à manipuler les positions de la souris en JavaScript.
3. Savoir comment ajuster les mouvements d'animation pour une meilleure expérience utilisateur.

Résumé

Découvrez comment utiliser JavaScript pour créer un impressionnant effet Parallax en manipulant les positions de la souris.

Description

Dans cette leçon, nous allons apprendre à créer un effet Parallax en JavaScript en utilisant les positions de la souris. Nous commencerons par déclarer quatre variables de référence pour calculer les positions en X et Y de la souris. Ensuite, nous définirons des variables d'amplitude de mouvement pour ajuster la vitesse du mouvement sur les axes horizontal et vertical. Cet ajustement permet de gérer les différences de dimensions entre la largeur et la hauteur de la scène. Nous utiliserons des coefficients spécifiques pour ralentir le mouvement vertical par rapport au mouvement horizontal, favorisant ainsi une meilleure expérience visuelle globale. Cette vidéo est idéale pour les développeurs qui souhaitent enrichir leurs applications web avec des animations plus dynamiques et interactives. Nous passerons en revue chaque étape du processus pour s'assurer que chaque concept est clairement expliqué et bien compris. En fin de leçon, vous saurez comment manipuler les éléments de votre scène pour produire l'effet Parallax souhaité.

Voir plus

Questions fréquentes

Pourquoi utilise-t-on deux coefficients différents pour les mouvements en X et en Y ?
On utilise des coefficients différents pour adapter la vitesse des mouvements sur les axes horizontal et vertical, car la scène est plus large que haute.
Quel est le rôle des variables poseX et poseY ?
Les variables poseX et poseY stockent les positions calculées de la souris par rapport à la scène, ajustées pour le centre.
Comment une variable de référence est-elle initialisée pour la position Y de la souris ?
La variable de référence pour la position Y est initialisée en utilisant la position Y de la souris divisée par la hauteur du Canva, puis divisée par deux.