Using TimelineMax as a selector of static images

[flash08]

As a former user of Adobe Edge, which has apparently been abandoned, I am going to have to rewrite a couple of Edge animations in GSAP. I am thinking of using Timeline Max to create what is essentially an animation that just changes the image a viewer sees, according to what button he clicks.

 

The idea is that, for instance, when a viewer clicks on button 4 (in a series of numbered buttons), the timeline advances to the designated frame and stops. Same action for all buttons.

 

Are there any examples of this type of "animation" using Timeline Max that anyone knows of?

[PointC]

Hi flash08 

 

I'm assuming you mean the images animate in/out right? There would be many ways to animate them, but I would think a simple slider would work well for that. If you search the forum, you'll find lots of topics about sliders and several CodePen examples. Here are a couple of my favorites from Diaco.

 

See the Pen XmozON by MAW (@MAW) on CodePen

See the Pen yYradO by MAW (@MAW) on CodePen

 

If you only want the images to change (no animation), it would be a simple matter of showing and hiding the images with a button click and you could do that with GSAPs set() method quite easily.

 

Hopefully that gets you started.

 

Happy tweening.

[flash08]

Thanks, that looks promising!