I am pretty new to GSAP. The following works great and changes between background images, but not sure how to speed it up so it's a little faster.
JavaScript:
var avatarAni = new TimelineMax({ paused: true, repeat: -1 });
avatarAni.to(avatars, animDuration, {
scaleX: 1.1,
scaleY: 1.1,
ease: Power3.easeIn,
onComplete: onCompleteScaleIn
});
avatarAni.to(avatars, animDuration, {
scaleX: 1.0,
scaleY: 1.0,
ease: Power3.easeOut
});
avatarAni.play();
animDuration
is the variable you can play with. Decrease its value a little bit and both of your .to()
tweens will go faster.
Otherwise, if you do not want to change individual tween values, you can use the .timeScale()
property of a TimelineMax
instance and it would speed up the avatarAni
timeline itself. So you could do this:
...
avatarAni.timeScale(2);
avatarAni.play();
The documentation says:
Factor that's used to scale time in the animation where 1 = normal speed (the default), 0.5 = half speed, 2 = double speed, etc.