henery Posted May 13, 2022 Share Posted May 13, 2022 Hi everyone, I'm trying to find a way to disable ScrollSmoother effects (like data speed) globally whenever the device window width is smaller than a certain value. Here's a demo using the Nuxt.js starter (I will be using Nuxt for the real project) in which I try to set up an event listener to get the device's width and then pass a computed property (useEffects) to the vars object that sets the effects to true or false. After this I refresh the scrollTrigger, but it doesn't seem to work, as the effects remain enabled. Am I missing something? Is there a particular way to do this? Thanks for the help! Link to comment Share on other sites More sharing options...
Cassie Posted May 13, 2022 Share Posted May 13, 2022 I'm pretty baffled here. I've hard coded in the vars and it's still doing parallax? https://codesandbox.io/s/zen-https-uyxwdq?file=/components/GSAPScrollSmoother.vue:580-783 There's a lot of code here, are you overriding the vars anywhere else? effects:false should have this effect so something's not right in your demo. I can't track it down though See the Pen yLvamJK?editors=0010 by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
henery Posted May 13, 2022 Author Share Posted May 13, 2022 Thanks for the answer Cassie. You're right, it looks like for some reason passing effects: false to the vars object doesn't work. So actually my question doesn't matter that much! Most of the demo isn't my code, I've just written the event listener logic over a fork of this ScrollSmoother+Nuxt integration example that @OSUblake posted. I'm going to try and look for the reason why effects: false doesn't work but maybe he knows? 1 Link to comment Share on other sites More sharing options...
Cassie Posted May 13, 2022 Share Posted May 13, 2022 Aha, excellent. Over to Blake then! Link to comment Share on other sites More sharing options...
PointC Posted May 13, 2022 Share Posted May 13, 2022 This thread may help. We discussed using media queries to change the data speed/lag to new values by looping through and killing the old ScrollTriggers. 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