I'm encountering an issue where some animations complete early due to the horizontal scroll pinning.

[iamStudent]

The animations work fine until section 3. In section 4, fadeup animations complete early due to the horizontal scroll pinning.

See the Pen jORNyXm by Students-the-sasster (@Students-the-sasster) on CodePen

[Rodrigo]

Hi,

 

This demo is an exact copy of this one:

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

 

Please create a demo of your own that shows what you're trying to do and not a copy/paste version of another demo that works in the way is supposed to work.

 

Happy Tweening!

[iamStudent]

Please check this demo, Image reveal animation is not working in the white section gallery.

 

See the Pen LYvPdpd by Students-the-sasster (@Students-the-sasster) on CodePen

[mvaneijgen]

You can set pinnedContainer: '.pin-gallery', to you imageReveal ScrollTrigger. from the docs https://gsap.com/docs/v3/Plugins/ScrollTrigger/

 

Quote

Element | String - If your ScrollTrigger's trigger/endTrigger element is INSIDE an element that gets pinned by another ScrollTrigger (pretty uncommon), that would cause the start/end positions to be thrown off by however long that pin lasts, so you can set the pinnedContainer to that parent/container element to have ScrollTrigger calculate those offsets accordingly. Again, this is very rarely needed. Important: nested pinning is not supported, so this feature is only for non-pinning ScrollTriggers

 

Hope it helps and happy tweening! 

 

 

See the Pen JjVPZGX?editors=0010 by mvaneijgen (@mvaneijgen) on CodePen