Storyline

Using GreenSock in Storyline 360 for Enhanced Animations

GreenSock animations are part of Articulate Storyline 360, and it just takes small, simple JavaScript snippets to take advantage of it. This framework allows you to easily add scale, bounce, and movement on any object in your Storyline stage.

In a previous video, I showed you how to get started with it, and in this video, I showed you how to apply it to a real-world example. We add a scale and bounce effect to objects when you hover over them. Scaling and bouncing is just one example of using GreenSock within any Articulate Storyline 360 course.

//Reference the object
var theObject = document.querySelectorAll("[data-acc-text='object_1']");

//Animate in GSAP
gsap.to(theObject, { x: 200 })
            

Jeff Batt

3 Jan, 2023