Search the Community
Showing results for tags 'onreversecomplete'.
Hi all, I have a page with clickable divs built with GSAP in vue.js. Clicking a div triggers a timelineMax animation that moves all three divs, changes their opacity, etc. When clicked, the “BACK” button applies the reverse() method, returning the divs to their original positions and styling. After reversing the animation, I am using the clearProps method to remove any remaining inline styling. As I am new to GSAP, I imagine there is a more elegant way of doing all of this but, it works. The issue arises when the user goes through this process again. When the divs are reset and user clicks one of them, the initial animation works but the reverse animation is very wonky. It seems to jump immediately to the beginning of the timeline, while simultaneously trying to reverse. It’s difficult to figure out exactly what’s happening because the debugger won’t step through the reversing timeline. Any advice would be appreciated. Thanks.
I have a project that I am building and unbuilding cards to a screen based on User feedback. My goal is: animate in the cards (TimeLine.staggerFrom) user chooses new set animate out the cards (using Reverse) onReverseComplete (load the new set of cards) Empty the container of cards Append the new HTML Animate in the new cards But the issue is my reverse complete is firing before the timeline is complete... I am guessing it is happening when a child card completes, I would like it to happen when the whole timeline reverse complete
Hey! I'm working on a time visualizer that uses a set of rings to indicate different time increments. There's still a lot of work to do, but I hit a snag I can't figure out. If you look at the codepen, you'll see the animation is looping pretty well in the forward direction (just a small glitch) but if you click anywhere, the animation will reverse, then eventually stop. I can't figure out how to keep it going. As suggested in other threads, I'm using the onReverseComplete to restart the animation, but the function never gets called. I also changed my 0 second animations to 0.0001 seconds with no luck. Any insights would be greatly appreciated. Thanks!