Horizontal scroll with multiples and different child animation
Hello,
I'm using Gsap Scroll Trigger with my all my entire pages.
I have multiples sections.
Every section has different child element.
I want to know if it's possible to handle specific part of sections (for example, 15% of a specific one, the same as I do with normal vertical scroll ).
But I don't know how to do it and I don't know if it's possible.
Praticale example:
In the codepen i want something like this this:
Apply different animations on different child element of
*** UPDATE with GSAP 3.8 ***
Since I have redirected to this post in quite a few threads, I just wanted to update it.
Things have become a lot easier with GSAP 3.8, which brings the containerAnimation property that lets you handle your ScrollTriggers in a much more intuitive way e.g. in fake-horizontal scroll scenarios like these.
The calculations explained below will not be neccessary anymore with this new feature if you want to trigger animations on invivid
