meTa Posted November 24, 2021 Share Posted November 24, 2021 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 More sharing options...
OSUblake Posted November 24, 2021 Share Posted November 24, 2021 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() 2 Link to comment Share on other sites More sharing options...
meTa Posted November 24, 2021 Author Share Posted November 24, 2021 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! 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now