Jump to content
Search Community

Fake Nested Pinning?

Freehand Sam test
Moderator Tag

Go to solution Solved by GreenSock,

Recommended Posts

What I'm trying to achieve is the effect of the individual slides (.number-slides) scrolling up very quickly, then locking and holding for a second, then releasing to quickly scroll to the next. The client wants it to feel more like each slide is "clicking" into place, as opposed to the smooth scroll. Essentially like a vertical carousel slider, but it's controlled via scroll. And pinned while it runs through the 3 slides.

See the Pen GRxKgPY by freehand_sam (@freehand_sam) on CodePen

Link to comment
Share on other sites

5 minutes ago, SteveS said:

I think I understand what you are talking about. If so then you have to animate the left hand content manually when the scroll hits a certain point. It's a pain to do honestly.

Thanks. Right, I assume I'm going to have to animate each slide separately instead of one long timeline that just animates the height of all three combined for starters. But I'm not even clear from there if it's possible to get a slide to stick and hold in place for a sec before animating in the next slide. 

Link to comment
Share on other sites

  • Solution

Yeah, there are a lot of ways to approach this. None are super simple. 

 

You could have a paused timeline where you animate between the slides (one long linear one that goes from slide one to two, two to three, etc.). Then, use a ScrollTrigger-based timeline that simply has equally-spaced callbacks that trigger a tween to the spot on the paused timeline where the corresponding slide is. You'd just need to sense the direction from the ScrollTrigger so you know which slide to go to. Like if it's going backwards and hits the callback, it'd be going to the previous slide. Forward would be next. 

 

Good luck!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...