GSAP ScrollTrigger - Historique Zelda

Pour cet exercice nous allons recréer une page démontrant l’évolution de la franchise Zelda au Nintendo et la bonifier d’animations synchronisées avec le défilement de la page.

Aperçu du résultat 👇

Matériel

Pen de départ 

Les librairies GSAP et ScrollTrigger sont déjà incluses dans le Pen de départ.

Requis

  1. Vous devez utiliser une boucle forEach sur chacune des bannières afin de déclencher une animation lorsqu'une d'elles devient entièrement visibles dans la fenêtre.

  2. Lorsqu'une bannière devient visible, doublez la taille de son image et animer là de sorte qu'elle retrouve sa taille d'origine.

  3. En même temps que l'animation précédente, faites apparaitre en fondu le titre du jeu et le faites le monter de 100px vers le haut, jusqu'à son point d'origine.

  4. Faites ensuite apparaitre en fondu l'année de sortie.

Notes de cours 📚