[Overlap Vertical Scroll with Smooth Scroll on Anchor Links]

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.

See the Pen ZEwXeGp by Chybosky (@Chybosky) on CodePen

[Continuous Carousel Scroll Help]

Thanks a lot 🙏 @Cassie

[Continuous Carousel Scroll Help]

Thanks guys, I was able to resolve the issue 🙏

[Continuous Carousel Scroll Help]

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.

See the Pen PoVmXOG by Chybosky (@Chybosky) on CodePen

[GSAP Slider Direction Issues]

Thank you @GSAP Helper

I have converted the Old GSAP to new GSAP code.

Please review the code: 

See the Pen OJZGvew by Chybosky (@Chybosky) on CodePen

[GSAP Slider Direction Issues]

After trying to set the slide direction to horizontal, the second slide doesn't appear on the screen.

Codepen link below:

[GSAP Slider Direction Issues]

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.

See the Pen wvjOMev by Chybosky (@Chybosky) on CodePen

[Vertical Scroll Snapping on WordPress]

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

Thank you

[Vertical Scroll Snapping on WordPress]

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?

See the Pen mdXbLOJ?editors=1010 by Chybosky (@Chybosky) on CodePen

[Vertical Scroll Snapping on WordPress]

24 minutes ago, OSUblake said:

 

I'm not sure what you mean by this. 

 

@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.

[Issue With Navigating Sections Vertically using Observer]

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.

See the Pen mdXbLOJ?editors=1111 by Chybosky (@Chybosky) on CodePen

[Vertical Scroll Snapping on WordPress]

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

[Vertical Scroll Snapping on WordPress]

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

[Vertical Scroll Snapping on WordPress]

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.

[Vertical Scroll Snapping on WordPress]

Hello @PointC @OSUblake

Thank you so much for your help.
This is what I have done so far on the Minimal Demo on CodePen.

 

See the Pen xxYKVag by Chybosky (@Chybosky) on CodePen

 

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 🙂

[Animating ::before Element on slides]

Thank you so much @PointC
I really appreciate you help.

 

I'm really learning a lot about GSAP and loving it so much.

 

 

[Animating ::before Element on slides]

Thank you so much @PointC

This is the changes I made:

See the Pen oNpKRvz by Chybosky (@Chybosky) on CodePen

 

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

 

[Animating ::before Element on slides]

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.
 

 

See the Pen oNpKRvz?editors=1010 by Chybosky (@Chybosky) on CodePen

[Vertical Scroll Snapping on WordPress]

@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.

[Vertical Scroll Snapping on WordPress]

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.