[about scrolltrigger multiple elements in same section]

You can make a GSAP timeline with the animation that you want and then, you can link the animation to ScrollTrigger.

[Transition by Scrub in Scroll Trigger]

18 minutes ago, ZachSaucier said:

Make sure the strings match the same format:

 

 

Thanks a Lot! Very satisfied with GreenSock Community

[Transition by Scrub in Scroll Trigger]

2 hours ago, ZachSaucier said:

You can use GSAP's .getProperty() to get the color value as well:

 

 

 

The concept is the exact same. You'd just use two clip-path properties and values instead of two colors  

Then it's not working as expected 🤔

See the Pen xxREydo by codeIMperfect (@codeIMperfect) on CodePen

[Transition by Scrub in Scroll Trigger]

Thanks!

But what if I wanna transition a clip-path value according to the scroll state?

[Transition by Scrub in Scroll Trigger]

In the codepen attached, the colors change alright, but the transition is sudden.

Now, I know I could add a Transition property to the section in CSS, but then, the transition ignores, scrub:true and takes a specific amount of time, instead of transitioning with scroll. Any way of transitioning with GSAP?

 

Thanks in Advance,

Harshit

See the Pen KKNgZEX by codeIMperfect (@codeIMperfect) on CodePen