Periyasamykrishnan
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by Periyasamykrishnan
-
-
On 7/11/2018 at 8:30 PM, PointC said:
I'm not sure what the question is here. Are you asking how to repeat a TimelineLite? If that's what you need, please try this:
var Tween = new TimelineLite({ onComplete: function() { this.restart(); } });
Hopefully that helps. Happy tweening.
how to add delay on oncomplete function
-
<script type="text/javascript">
window.onload = function() {
timeline();
};function timeline() {
var timers = 0.15;
var Tween = new TimelineLite();
Tween.add(TweenLite.to(['.logo'], 0.5, { autoAlpha: 1 }), timers);
timers += 0.2;
Tween.add(TweenLite.to(['.img_1'], 0.3, { autoAlpha: 1, left:-1, ease: Power4.easeOut }), timers);
timers += 0.2;
Tween.add(TweenLite.to(['.img_2'], 0.3, { autoAlpha: 1, bottom:-1, ease: Power4.easeOut }), timers);
timers += 0.2;
Tween.add(TweenLite.to(['.img_3'], 0.3, { autoAlpha: 1, top:-1, ease: Power4.easeOut }), timers);
timers += 0.2;
Tween.add(TweenLite.to(['.img_4'], 0.8, { autoAlpha: 1, scale: 1,ease: Elastic.easeOut.config(1, 0.5) }), timers);
Tween.add(TweenLite.to(['.ml'], 1, { autoAlpha: 1, bottom:-1, ease: Elastic.easeOut.config(1, 0.6) }), timers);
timers += 0.2;
Tween.add(TweenLite.to(['.img_5'], 0.3, { autoAlpha: 1, left:-1, ease: Power4.easeOut }), timers);
timers += 0.2;
Tween.add(TweenLite.to(['.img_6'], 0.3, { autoAlpha: 1, bottom:-1, ease: Power4.easeOut }), timers);
timers += 0.5;
Tween.add(TweenLite.to(['.cta'], 0.5, { autoAlpha: 1 }), timers);
Tween.add(TweenLite.to(['.cta:hover'], 0.5, { autoAlpha: 1 }), timers);
timers += 2;
Tween.add(TweenLite.to(['.logo','.ml','.img_1','.img_2','.img_3','.img_4','.img_5','.img_6','.cta','.cta:hover'], 0.1, { autoAlpha: 0 }), timers);
console.info('Total times: '+timers);
}
</script>
TimelineLite Repeat problem
in Banner Animation
Posted
how to add delay on oncomplete function?