Jump to content
GreenSock

meTa

remove gsap on window resize event

Recommended Posts

hi,

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 

 

tween.kill(true);
gsap.killTweensOf('.panel')
ScrollTrigger.getById("pagecontent").kill(true);
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?

 

thanks

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.

 

https://greensock.com/docs/v3/Plugins/ScrollTrigger/static.matchMedia()

 

https://greensock.com/docs/v3/Plugins/ScrollTrigger/static.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.
×