[Issue with ScrollTrigger pinning in Gatsby/React site]

Hi @FrankRuiz,

 

Have you tried surrounding your pinnedRef  with a <div> ... </div> ?

 

<div>
   <VerticalSliderWrapper className="vertical-slider-wrapper" ref={pinnedRef}>
      ...
   </VerticalSliderWrapper>
</div>

 

I have a similar issue when changing routes on react router, and this simple change fixed my problem.

 

Cheers

[ScrollTrigger Layered Pinned with animations inside]

Thanks @akapowl !

This is the solution, I will read the link to have everything clear.

 

Daniel

[ScrollTrigger Layered Pinned with animations inside]

Hi there, 

 

I was wondering if it is possible to add GSAP animations between these other animations that have ScrollTrigger. I mean the run some animations inside the first section, finish this animations and then animate the overlap transition to the next section. The same with all the following sections.

I'm kind of new in these animations and couldn't find more examples to try. I was trying with disable method on ScrollTrigger but nothing so far.

Thanks in advance.

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