Jump to content


Export/Import Timelines/Tweens to JSON

Recommended Posts

I've been using GSAP for a few months now. I'm currently using TweenMax in a project that allows users to set entrance/exit animations for HTML elements. I've written the code that adds each entrance/exit timeline to parent timelines.


What I'm wondering, though, is whether there's a way to export all timeline/tween properties to JavaScript Objects or JSON, store the data, and subsequently import the data after reloading the webpage? In theory, this would prevent the need to create each timeline on the fly with each web request.


Thanks to anyone who can help me out.

I'm currently using TimelineMax together with CSSPlugin.

Link to comment
Share on other sites

There isn't a built-in way to export all animations to a JSON format and then import it again, but it should certainly be possible for you to create something like that by looping through the "vars" object (for properties) and easily snag the target and duration(), startTime(), etc. 

  • Like 3
Link to comment
Share on other sites

Gotcha. That's essentially what I've decided to do. The problem was that there's a lot of conditional logic when applying an animation to a specific element. It will be sufficient to store the results of the logic (vars, duration, startTime) as an array of objects. Then simply loop through those objects and apply them to the target on the front end.



Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.