Jump to content


ScrollTrigger, matchMedia and gsap.set

Recommended Posts



I'm trying to implement matchMedia with ScrollTrigger, it works very well but I have this little problem with gsap.set that I'm required to use because the pin method overrides my CSS transforms (in my CSS comments). 
But it doesn't seem to apply at all, or just for a brief moment when crossing my 800px breakpoint.

Any help and comment very much appreciated,



See the Pen JjXKdBY by deodat (@deodat) on CodePen

Link to comment
Share on other sites

Hey deodat and welcome to the GreenSock forums.


One of the common GSAP mistakes is not setting all of their transforms with GSAP. We recommend doing so (so good job commenting that out!).


One solution would be to apply the .set() as the animation for the ScrollTrigger. That way when the ScrollTrigger is refreshed the .set() is called again. One option of doing that would be to pass in the .set() you need to the pinIllustr function:

See the Pen QWNEEOe?editors=0010 by GreenSock (@GreenSock) on CodePen

  • Like 2
Link to comment
Share on other sites

Hey Zach,


thanks a lot for your precious help !
It works perfectly great for me :)
Pass the animation as a parameter, I'll remember it !




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.