Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
codeIMperfect

Transition by Scrub in Scroll Trigger

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

Thanks!

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

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

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

Link to comment
Share on other sites

18 minutes ago, ZachSaucier said:

Make sure the strings match the same format:

 

 

Thanks a Lot! Very satisfied with GreenSock Community :)

  • Like 1
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.

×