Hi there everyone,
I'm hoping to explain this as clear as possible.
I have two buttons: one button Is for playing a tween between two certain labels inside a timeline. The second button is for canceling the tween from the first button, and starting a new timeline.
var tween1Tl = new TimelineMax({ repeat: 0, paused: true});
tween1Tl
.add("startLabel")
.fromTo('#something', .5, {x:'-50', opacity:0}, {x:'0', opacity:1,ease: Power3.easeInOut})
.fromTo('#somethingElse', .5, {y:'-50', opacity:0}, {y:'0', opacity:1})
.add("halfwayLabel")
.fromTo('#fooBar', .5, {scale:0, opacity:0}, {scale:1, opacity:1,ease: Power3.easeInOut})
.fromTo('#fooBar2', .5, {x:'-50', opacity:0}, {x:'0', opacity:1,ease: Power3.easeInOut})
.add("endLabel")
;
$('#btn1').on('click touchstart', function() {
tweenTest = Tween1Tl.tweenFromTo("halfwayLabel", "endLabel");
});
$('#btn2').on('click touchstart', function() {
tweenTest.pause(0);
tween2TL.play();
;
My problem:
When I press btn2, I want tweenTest to fully stop and dissapear.. So actually to have it pause at "startLabel". As you can imagine, when I pause tweenTest right now, it pauses halfway, so the assets are still there.. I hope I've made my intentions clear and would love someone to help me out.
Thanks in advance!