How to use GSAP for animation in Storyline

Jul 15, 2022

As i get this question quit often, i am making a online tester for Gsap animation in Storyline. First step is scaling an image. And defining where you want to scale it from. This transformation point can be set by Gsap and thus change the effect of your animation completely.

Here you can see how this works. To be continued.

54 Replies
David  Holzemer
Math Notermans

.... Or use just an image to create your own buttons.

I'm not sure what you mean? If you use an image and then have multiple states don't you have the same issue of Articulate giving the states different names? 

or would you have to target each individual state in the JavaScript?  

//Reference the object
var btnCare = document.querySelectorAll("[data-acc-text='btnNormalState']");
var btnCareOver = document.querySelectorAll("[data-acc-text='btnHoverState']");

//Animate in GSAP,{scale:1.15,ease:"bounce.out"});,{scale:1.15,ease:"bounce.out"});

I have a feeling it's not quite as easy as this though.