ScrollTrigger shifted position declared before pinned ScrollTrigger

[perfecti]

Hello, I declare animations in two ways page.js and common.js (animations that are used on different pages) and found that if scrollTrigger (common.js) is declared before the scrollTrigger with pin (page.js) declaration, then the position of the triggers will be shifted. This can only be solved by including the common.js file after all page.js or is there another way?

 

 

See the Pen qBpeOPQ by Speculant (@Speculant) on CodePen

[Cassie]

Hello there! 

I think this may be useful

 

Quote

Creating ScrollTriggers out of order

If you have any ScrollTriggers that pin elements (with the default pinSpacing: true) then the order in which the ScrollTriggers are created is important. This is because any ScrollTriggers after the ScrollTrigger with pinning need to compensate for the extra distance that the pinning adds.