ferriss Posted December 8, 2020 Share Posted December 8, 2020 Hi, Using the attached codepen, I have this working fine. But when setup in a NuxtJS or equivalent environment with ajax route changes the ScrollTrigger.scrollProxy stops calling. I've tried ScrollTrigger.kill() on the destroyed() method of NuxtJS, but whenever I go back to the route with the setup, scrollTop() doesn't call within ScrollTrigger.scrollProxy. Thanks See the Pen ExPdqKy by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
ferriss Posted December 8, 2020 Author Share Posted December 8, 2020 I think the issue here is to do with the fact I'm using .batch() or more than 1 instance of ScrollTrigger. Yet there is only 1 ScrollTrigger.scrollerProxy in the example, it's not setup to work with multiple instances? Link to comment Share on other sites More sharing options...
ferriss Posted December 8, 2020 Author Share Posted December 8, 2020 Here I've made a reduced test case: https://codesandbox.io/s/white-microservice-pi1by If you click about, it works the first time, but then if click home and then back to the about page, only the first scrollTrigger reveals. The rest do not work. 1 Link to comment Share on other sites More sharing options...
Solution GreenSock Posted December 9, 2020 Solution Share Posted December 9, 2020 I believe that's resolved in the upcoming release which you can preview at https://assets.codepen.io/16327/ScrollTrigger.min.js And here's a .tgz file with the public stuff (in beta) that you can npm install: https://assets.codepen.io/16327/gsap-beta.tgz Better? If you need a workaround for the current version, let me know. Basically it's caching the first scrollerProxy for that particular element - I hadn't anticipated anyone creating multiple scrollerProxies for the same element. So you could just create a variable that keeps track of the latest "this.locoScroll" in your file (the LocomotiveScroll object) and then reference that in your scrollTop getter, like yourVariable.scroll.instance.scroll.y. 1 2 Link to comment Share on other sites More sharing options...
ferriss Posted December 9, 2020 Author Share Posted December 9, 2020 Perfect, the new BETA fixed the issue. 1 1 Link to comment Share on other sites More sharing options...
nazanin Posted February 20, 2022 Share Posted February 20, 2022 On 12/9/2020 at 6:06 PM, ferriss said: Perfect, the new BETA fixed the issue. hi, i have the same issue, can you explain more how did you fix it? how should i add the BETA Link to comment Share on other sites More sharing options...
GreenSock Posted February 21, 2022 Share Posted February 21, 2022 Hi @nazanin. This is a very old thread and that fix has been out for a very long time. If you're running into trouble, please post a minimal demo (like in CodeSandbox or CodePen). Also, make sure you kill() all the old ScrollTriggers when you do your routing change. An easy way to do that is: ScrollTrigger.getAll().forEach(t => t.kill()); 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