Gsap Animation Alignment Issue

Tu as essayé d'englober ton code avec un truc qui attend que le Dom soit prêt ?

document.addEventListener('DOMContentLoaded', function() {
... ton code
});

Salut Manu,
Merci pour la suggestion, je vais tester ça 🙂

@Manu Lechat Pas certain d’avoir refermé les balises correctement 😅 … j’ai bon !?

<script><br />document.addEventListener(‘DOMContentLoaded’, function() {<br /> gsap.registerPlugin(ScrollTrigger);<br /><br /> // Configurations pour les différentes animations<br /> const animations = [<br /> { wrapper: “.mask-wrapper01”, trigger: “.section-long01" },<br /> { wrapper: “.mask-wrapper02”, trigger: “.section-long02" },<br /> { wrapper: “.mask-wrapper03”, trigger: “.section-long03" },<br /> ];<br /><br /> // Boucle pour créer les animations<br /> animations.forEach(({ wrapper, trigger }, index) => {<br /> <a target="_blank" rel="noopener noreferrer" href="http://gsap.to">gsap.to</a>(wrapper, {<br /> width: “100vw”, // Pleine largeur<br /> height: “100vh”, // Pleine hauteur<br /> borderRadius: “0rem”, // Coins carrés<br /> scrollTrigger: {<br /> trigger: trigger, // Élément déclencheur<br /> start: “top top”, // Début de l’animation<br /> end: “bottom bottom”, // Décalage pour une fin plus naturelle<br /> markers: true,<br /> ease: “power2.out”, // Transition fluide<br /> scrub: 2, // Rend l’animation fluide et synchronisée<br /> },<br /> });<br /> });<br />});<br /></script>

Arf ! toujours pas !

@Ouya Fabien en général, c’est dû au chargement des images en décalage avec le calcul Scrolltrigger, tu peux le gérer en codant un timeout ou utiliser une lib de type imageloaded, sinon pour faire super simple tu passes tes images en “eager”

Ok merci @Youness Benammou

Bien vu @Youness Benammou ça fonctionne correctement à présent 🙂 Merci pour votre aide les gars, you rock 🤘

Du coup j’ai fait un topo à chatGPT 🤓😂

T’as oublié de l’insulter mais tranquille c’est pas une compét

@Thomas Carré Je parle toujours poliment à 🤖😅 Commence pas à flooder tu sais bien très où ça va nous emmener 🔥🤣