How to pin section in scrollTrigger?

[azadsarxanli 6 Likes (Newbie)]

Hi! I need some help. 

I want to do something like this: 

See the Pen oNjgEjm by GreenSock (@GreenSock) on CodePen

at that case, the section stops, animation ends and after that  scroll works normal. 

How to do it for "h2" tag in my code? 

 

 

See the Pen NWvOwZG by azadsarxanli (@azadsarxanli) on CodePen

[Cassie 5,407 Likes (Superhero)]

Hey there @azadsarxanli,

 

The trick with scrollTrigger pinning and triggers is usually to use a container element as the trigger and pinned element.. If you use the element you're animating when the element moves the trigger positions can change and cause jumps 🙃

Here's a fork where I'm using the container as a trigger, and pinning that container.

See the Pen gOxBoGp?editors=0010 by GreenSock (@GreenSock) on CodePen