Search the Community
Showing results for tags 'build from data'.
Found 1 result
-
The animation in the Codepen ends using a staggerTo animation. Some info regarding the codepen: It uses the data object to store each tween's settings. There are 2 ways of running the animation: Directly and from the stored data (see above) The initial animation (what I'm calling the direct animation) runs when the page loads and if you click the REPLAY button. Each time it rebuilds using some random settings so runs a little different each time. When you click the PLAY FROM DATA button, I run a function that I'm using in my local app called getGsapData to snag all the data from the timeline and then pass that data to an animateFromData function to exactly replicate what was created randomly. (I have to be able to store the data in a file locally so can't just store the timeline itself. ) THE ISSUE is that when the direct animation runs, the ending staggerTo animation seems to animate each of the items out all at once. But, when you run the animation from the storedData, it seems to animate off the way it's meant to work - staggered. I've been trying to figure out what's different between the 2 for two solid days. Can any of you guys (most of whom are much smarter than me) possibly figure out what the deal is? I can change the staggerTo params in the initial animation and it doesn't seem to change the way the animation runs on REPLAY. The animation data gets sent to a textarea and prints as a pretty json string for perusal. So sorry for the complexity of the codepen but for what I'm attempting to do, I didn't see much I could do to both replicate the issue and simplify the example. I actually did remove quite a bit of stuff.
