Jump to content


remove gsap on window resize event

Recommended Posts


i'm using the following code to create a fake horizontal scroll 

tween = gsap.to(sections, {
            xPercent: -100 * (sections.length - 1),
            ease: "none",
            scrollTrigger: {
              id: "pagecontent",
              trigger: ".pagecontent",
              pin: true,
              scrub: 1,
              snap: false,
              end: () =>  "+=" + (panelsContainer.offsetWidth - innerWidth)


on my mobile version (screen < 992px) i dont want to use gsap at all.

i've added a eventlistener for resize and checking if the size is < 992px.


my question now is how do i completely kill / destroy all gsap settings?

i've already tried 


gsap.set(sections, {clearProps: true});

this does not work. all transforms and the pin-spacer div element will stay.


is there any method or way to remove gsap on page resize?



Link to comment
Share on other sites

Welcome to the forums @meTa


Normally you can just do tween.scrollTrigger.kill(true), but what you're looking for is matchMedia and you might need saveStyles.





  • Like 2
Link to comment
Share on other sites

thank you for your fast reply @OSUblake

the tween.scrollTrigger.kill(true) does all what i need. for sure the matchMedia would be a better approach. ill check that later.


thank you!

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