denisholc7

Alright. Thank you for the help!

Hi and thank you for your fast reply. I've tried to replicate with GSAP Starter Template but unfortunately it didnt work. The text was stuck on the left and I couldn't scroll down anymore. I decided to remove everything and followed that SvelteKit template. It didnt work, until I removed dynamically imported gsap and scrollsmoother from my project. const { gsap } = await import('gsap'); const { ScrollTrigger } = await import('gsap/ScrollTrigger'); Now it works. So I can have a smoothscroller and that image comparison with ScrollTrigger. Unfortunately, I got another issue. I am also pinning hero section: onMount(async () => { gsap.registerPlugin(ScrollTrigger); gsap.to(".sticky-hero", { scrollTrigger: { trigger: ".sticky-hero", start: "top top", // start the pinning when the top of the element reaches the center of the viewport end: "+=4000", pin: true, // pin the element in place scrub: true, // smooth the pinning effect }, }); // Add another GSAP animation for the LeftNavbar component }); And in order to scroll to the bottom of the page, I have to set #smooth-content to height of 12000px in order to get to the bottom. I know that without a minimal demo is hard for anyone to guess if this is normal. I will try gsap when I start another project from scratch as I am a beginner and already have so many components in my projects, so it's confusing. So my questions are: 1.) There shouldn't be a problem mixing all gsap functions? Like ScrollTrigger, ScrollSmother, pin, etc? 2.) Does is matter if I set height so high? Because with 12000px. I also have 8 components on page so I can assume that it's fine? 3.)If I start with SvelteKit from scratch, I should do exactly like how it's in the template? That's how I should set everything from the beginning right? Thank you again for your time and help.

Hi, I am a beginner and I'm trying to learn GSAP. i tried gsap-trial and scrollsmoother. It works well but the issue is that the image will disappear and appear at the bottom (or top if I scroll back to top). I tried ot set data-smooth to false but it doesn't really help. And I am talking about that one. So now the only solution is to disable the ScrollSmoother, unless someone else knows the solution? Thank you