Greensock Background change

[phillip_vale 3 Likes (Newbie)]

Hi,

I'm trying to get a background image .gif to change from one image to the another.

I want the animation to change from Homer to Leo and repeat endlessly.

 

I'm just after a straight cut in the transition so i thought .set would do it rather than a .to or .from with opacity etc.

 

Thanks for the help,

Phil

See the Pen jOzMNry by phillipanthonyvale (@phillipanthonyvale) on CodePen

[Cassie 5,372 Likes (Superhero)]

Hey there,

 

You'll get a straight cut anyway with a to tween as you can't animate between different background images - there's no 'in between' state. It's either one image or the other.

But whether you're using set or to you're going to need to add some position parameters and maybe a repeatDelay so that your tweens are spaced out. Right now they're both happening at the same time (set is 0 duration)

See the Pen XWEjXMj?editors=1111 by GreenSock (@GreenSock) on CodePen

I've also updated your timeline to use the latest syntax and not timelineMax (that's version 2)

 

Hope this helps!
 

[phillip_vale 3 Likes (Newbie)]

Amazing, thanks so much Cassie!

 

Just a quick question. What happens to the gifs when they aren't showing are they still playing in the background?

 

OR does the .set function sort of turn them off?