scd

Thanks Rodrigo! I set it up properly according to your feedback (I think, see my codesandbox) but I'm running into this problem now. I see you responded with a solution at the bottom, but I don't think I can do that because I'm working for a company that doesn't allow external links in the code, everything is a local registry. Any ideas?

hi all, new to gsap and sveltekit. I have a reused component that shows the time. When the time is displayed, I want it to animate in with lets say a fade. On the main page I have multiple instances of this component ie <Component time={"2:45PM"}/> <Component time={"5:00AM"} /> <Component time={"1:30AM"}/> and the component looks basically like <script> import { gsap } from 'gsap'; import { onMount } from 'svelte'; export let time; onMount(() => { gsap.registerPlugin(ScrollTrigger); const tl = gsap.timeline({ scrollTrigger: { trigger: '.time', start: 'top left', end: 'bottom left', scrub: true } }); tl.fromTo('.time', { opacity: 0 }, { opacity: 1, duration: 1 }); }); </script> <div> <div class="time">{time}</div> </div> But that doesn't work. What am I missing? Here's an interactive demo https://codesandbox.io/p/devbox/svelte-gsap-test-php853?file=%2Fsrc%2Froutes%2FSlide.svelte I want the times displayed to animate in