remove Pin spacing under final section

[Jameshofton]

Hi, 

 

I am have gone through lots of other peoples posts to see if i can find a solution and some of them have helped me get closer to what i need. I was hoping for some help if possible.  

 

I have 4 sections, each with a lottie file in.  They reach a section, it pins until the end of the lottie animation and then moved onto the next one.   I did have it all 100% View port height, but the client did not like that.   I have created a version in Codepen,  so you can see the code.  

 

I would really appreciate any help, tips to solve this. 

See the Pen eYoWdBR by jameshofton (@jameshofton) on CodePen

[Rodrigo]

Hi,

 

One solution is to wrap the lotties section and the next one in a common parent and pin that one:

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

 

The other solution is to create two ScrollTrigger instances to pin both sections at the same time for each lottie section and use pinSpacing false for the looties wrapper:

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

 

Hopefully this helps.

Happy Tweening!

[Jameshofton]

15 hours ago, Rodrigo said:

Hi,

 

One solution is to wrap the lotties section and the next one in a common parent and pin that one:

 

 

 

The other solution is to create two ScrollTrigger instances to pin both sections at the same time for each lottie section and use pinSpacing false for the looties wrapper:

 

 

 

Hopefully this helps.

Happy Tweening!

Thanks so much for your reply,  i will go through it on Monday wen back at work.  I really appreciate you taking the time to reply to me.