theodieu

I was struggling finding out the proper way of specifying the target for gsap, but your example shows exactly how to do it! Thanks, that was very helpful!

Hello, I'm not a pro, so forgive my vocabulary if it's not accurate... I am trying to find out how I could use GSAP to animate the value of a state managed by Zustand (React state management). Here is how basic Zustand works: Creating the store: const useStore = create((set) => ({ bears: 0, increasePopulation: () => set((state) => ({ bears: state.bears + 1 })), removeAllBears: () => set({ bears: 0 }), })) Binding components: function BearCounter() { const bears = useStore((state) => state.bears) return <h1>{bears} around here...</h1> } function Controls() { const increasePopulation = useStore((state) => state.increasePopulation) return <button onClick={increasePopulation}>one up</button> } Let say I want to tween the value of the state bears from 0 to 100. I would like to understand how to do it using 2 different approaches: how would you do it using a method within the store? how would you do it using a function within the component? Or are those approaches wrong? Thank you!

Yes, it makes sense now. Thank you!

Great! Thank you so much for the detailed explanation, and the extra tips! It all works well now. If I understand well the issue 1 you mentioned (please correct me if I'm wrong) : animations of the same element should not overlap. If for any reason I want them to overlap, would using timeline solve the issue?

Thanks!

To give more precision, the problem seems to be connected with having 2 animations for the same element: if I remove the first animation, then the second one works... https://codepen.io/theodieu/pen/gOMpRVj

Hello, I'm new with gsap/ScrollTrigger. I'm trying to animate the sections of a page when they enter the screen, and then when they leave the screen. It works well when they enter, but I don't get them to work when they leave... See the codepen it will speak by itself. What am I doing wrong? And another little detail : the section is "jumping" when the first ScrollTrigger reaches the end of the pin. Why? Thank you!