Jump to content
Search Community

Transition by Scrub in Scroll Trigger

codeIMperfect test
Moderator Tag

Go to solution Solved by ZachSaucier,

Recommended Posts

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

Link to comment
Share on other sites

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

See the Pen QWGKxqm?editors=0110 by GreenSock (@GreenSock) on CodePen

 

28 minutes ago, codeIMperfect said:

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

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

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...