pdub888 Posted September 21, 2021 Share Posted September 21, 2021 I may not be doing this correctly but I'm trying to listen on window resize, refresh the scrollTrigger and then also it's start and end values. The initial create works well. On resize, i'm getting all the logs except for the dynamic function ( getPadding1() and getPadding2() ). On resize, the start and end markers just do not change ( but if i hard refresh the page, it works ). There's probably a little mistake in here i'm not catching - please let me know ( thx 😞 let w = window.innerWidth; let h = window.innerHeight; let padding1 = h - ((w * .62) * .90); let padding2 = ((w * .62) * .90) + padding1; gsap.registerPlugin(ScrollTrigger); window.onresize = reportWindowSize; ScrollTrigger.addEventListener("refresh", function() { console.log("REFRESHED ") console.log(padding1 + " padding1") }); function reportWindowSize(){ console.log("window size"); let newW = window.innerWidth; let newH = window.innerHeight; padding1 = newH - ((newW * .62) * .90); padding2 = ((newW * .62) * .90) + padding1; console.log(padding1 + " padding1" + " " + padding2); ScrollTrigger.refresh(); } function getPadding1(){ console.log("GETPADDING1" + padding1) return padding1; } function getPadding2(){ return padding2; } const anim1 = gsap.to(".para-clip2", { webkitClipPath: 'inset(0% 0% 0% 0%)', clipPath: 'inset(0% 0% 0% 0%)', ease:Linear.easeNone }); ScrollTrigger.create({ trigger: ".trigger1", animation: anim1, markers: true, start: getPadding1() + "px bottom", end: getPadding2() + "px bottom", scrub: true, invalidateOnRefresh: true }); Link to comment Share on other sites More sharing options...
Solution OSUblake Posted September 21, 2021 Solution Share Posted September 21, 2021 Welcome to forums @pdub888 You should use a function with invalidateOnRefresh values you want to recalculate. start: () => getPadding1() + "px bottom", end: () => getPadding2() + "px bottom", 3 Link to comment Share on other sites More sharing options...
pdub888 Posted September 21, 2021 Author Share Posted September 21, 2021 He shoots, he scores. 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