Maria Ferraro Posted January 6, 2023 Posted January 6, 2023 Hello! I'm new with Gsap and I'm trying to change the background color of a section and it works great, the thing is when I switch to dark mode it doesn't chenge the default background color to the darker one, only happens if I switch it before going to that section. (I'm using React Switch) The colors are a variable that checks if dark mode is activated or not, but timeline doesn't change with it. Already tried with toggleActions. I think I might have to do a function to change the color when the dark mode is active or inactive, but I'm not sure how... This is how it looks like when I get there this is how it looks if I change the theme This is how should look (and how it looks when I go to other page and come back) I tried to put it into a CodePen but not really working See the Pen gOjLEdx by mariaferraro (@mariaferraro) on CodePen.
GreenSock Posted January 7, 2023 Posted January 7, 2023 Welcome to the forums, @Maria Ferraro! Unfortunately it looks like your demo is completely broken and not showing anything at all. Would you mind providing a minimal demo that isn't throwing errors like that so we can poke around and see what's going on? One thing you should definitely do is wrap your code in a gsap.context() - it's your new best friend in React because it makes cleanup super easy (and selector scoping too). This article is a must-read: React 18 actually calls useEffect()/useLayoutEffect() TWICE in strict mode which means you might be creating multiple competing animation/ScrollTriggers accidentally that are fighting with eachother because you didn't do proper cleanup (revert/kill the old one before creating the new one). The article explains it all. Once we see a minimal demo that shows the issue, we'll gladly answer any GSAP-specific questions. ?
GreenSock Posted January 7, 2023 Posted January 7, 2023 By the way, here's a React-based Stackblitz demo with ScrollTrigger that you can just fork if that's easier: https://stackblitz.com/edit/react-cxv92j
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