Layered pinning - ScrollTrigger: I need to use for 4 100vh sections and 5th with auto height

[AndresBG]

Hey guys! how are you! first of all, really like to thank you for this amazing tool.

 

I already implemented this sample code for my own webflow project. This is working just fine if I have a page with equal sections (panels).

The current design includes a 5th section that is larger than the rest and when this is added to the layout, the pinned efect didnt calculate properly the 100vh for the first 4 sections. I dont need the 5th section to be pinned, only to scroll down normally until the end.

 

Is there a way to switch off or not to apply the layered pinning for my last section?
Hope that you could help me with this one! Thanks in advance

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

[elegantseagulls]

This is only pinning sections with with class name '.panel', so if you don't add that class, it won't pin.

[AndresBG]

Thanks for your quick turnaround! It seems that after adding a different section with different class names not solve the issue im facing.

 

After adding the new section is like the other sections failed to calculated the 100vh and the scroll down behaves weird jumping or skipping sections, the 5th long section is over the top of the previous one (not stacked as a normal section). Do you think will help if I send you the two urls?

[elegantseagulls]

Creating a minimal demo in codepen would be most useful

 

[AndresBG]

Great! in the meantime please checked this working url standard panel class name 100vh 
https://layered-pinning.webflow.io/custom-sections
 

and this is what happens when you have a new section different class name no-pinned auto or fixed height

https://layered-pinning.webflow.io/custom-sections-5th-no-pin

 

Please let me know if you still need a codepen demo, thanks!

[GreenSock]

Yes, @AndresBG, we definitely need a minimal demo in something like CodePen if you'd like further help. Thanks!