Chybosky

Hello Everyone! Trust you are doing well. I am current struggling with implementing smooth scroll on the anchor link on the progress bar. I would like for the section scroll smoothly to the section once the anchor link is clicked. Please what is the best way to achieve it? I sincerely appreciate any help provide. Thank you.

Thanks a lot 🙏 @Cassie

Thanks guys, I was able to resolve the issue 🙏

Hello Everyone, Trust you are great. Please I need your help to make my slider scrollable. I have tried to kill the timeline at the end of the the scroll and it restarts but it does not scroll until I scroll back to the previous slide and then forward. I sincerely appreciate any help provide. Thank you.

Thank you @GSAP Helper I have converted the Old GSAP to new GSAP code. Please review the code: https://codepen.io/Chybosky/pen/OJZGvew

After trying to set the slide direction to horizontal, the second slide doesn't appear on the screen. Codepen link below: https://codepen.io/Chybosky/pen/wvjOMev

Hi Everyone!, Please I need some help with this GSAP Slider code. I want to switch the Scroll direction to be vertical but when I do, the other slide item doesn't come up. I look forward to your feedback, Thank you.

Is it required to have the Outer and Inner div class when working with Observer Plugin? Thank you

Thank you so much @OSUblake, It stopped the continuous scrolling. I implemented it on my Minimal demo and it work. I experienced one sight issue when scrolling. After scrolling to the section, on page scroll up, the last section sticks underneath and appears visible on scroll. Please what did I do wrong? Vertical Scroll with Observe test (codepen.io)

@OSUblake When the Scroll gets to the last slide, it returns to the beginning of the page. Is it possible to have the slide scroll only scroll up at the end of the page.

Hello, I tried implementing a vertical scroll using Observer plugin but I'm currently experiencing an issue with the switching the snapped section. I got Inspirations from the Animated Sections by Brain. Thanks in advance for the help.

Please I will really appreciate any learning resource on Vertical Scroll Snapping using Observer Plugin.

Thank you @OSUblake. Please How can I set this to just scroll up and down and not animate continuously?

Also the Footer and the Copyright section in the get covered by the last panel. I couldn't figure the reason why. I also attempted using CSS Snapping but it didn't give the exact prototype feel.

Hello @PointC @OSUblake Thank you so much for your help. This is what I have done so far on the Minimal Demo on CodePen. https://codepen.io/Chybosky/pen/xxYKVag The Scrolling doesn't snap to the very top of the bar. Also is it possible to have the page scroll on the slightest scroll using GSAP? Thank you ?

Thank you so much @PointC I really appreciate you help. I'm really learning a lot about GSAP and loving it so much.

Thank you so much @PointC This is the changes I made: Home Slider (codepen.io) I have made the changes and I can separate the animation for both the text and the :after element but I have some issues that I encountered. One of the issues is The ::after(background) element does not come first after the first slide passes. The second issue is with the SmoothScroller Script, I had some issues testing it on a live website. Please how can I resolve it. Thank you

Hello Community, Please I need some assistances with Animating the ::before element on each slides. I tried but the text keeps coming before the ::before (Rectangle background) element. I would like to make the rectangle comes first then the text over it second. The Text can start coming over it halfway when the rectangle enters the banner and reverse the flow on exit.

@OSUblake Thank you very much, I'm currently working on the Minio.al Demi @PointC Thank you so much for pointing out this error, I have removed the unused variables and currently working on the Minimal Demo. Which I will share here soon.

I need some help, I am currently experiencing some issue on a website I am working on. Here is the website URL https://gsap.asdt.com/home-2 The Scroll Snap doesn't work on the page. Here is the my GSAP code; <script> gsap.registerPlugin(ScrollTrigger); gsap.utils.toArray(".panel").forEach((panel, i) => { ScrollTrigger.create({ trigger: panel, start: "top top", scrub: true, pin: true, pinSpacing: false }); }); ScrollTrigger.create({ snap: 1 / (panels.length - 1), duration: 0.5 }); </script> Please how to I resolve the problem.