Mikael Fager

Hello, I have created an Animate project where I have used TimelineMax and a few Animate timelines/tween. (the reason for Animate timeline is that I need to utilise mask). From my TimelineMax I would like to call the Animate timelines/tween to start these, rather than have them all fired at once in the beginning. As you will see in the attache code, the yellowBar2_mc is the movieclip that need to be called to start later in the timeline. var tlheadline = new TimelineMax({}); tlheadline.to(this.inspire1_mc, .8, {delay:.1,alpha:1, ease:Sine.easeOut}) tlheadline.to(this.inspire1_mc, 4.5, {delay:-.9,x:"+=100",ease:Power2.easeOut}) tlheadline.to(this.yellowBar1_mc, 4.5, {delay:-4.5,x:"+=100", ease:Power2.easeOut}) tlheadline.to(this.inspire1_mc, .4, {delay:-2.3,alpha:0,ease:Sine.easeOut}) tlheadline.to(this.yellowBar1_mc, .4, {delay:-2.3,alpha:0,ease:Sine.easeOut}) tlheadline.to(this.engage_mc, .8, {delay:.1,alpha:1, ease:Sine.easeOut}) tlheadline.to(this.engage_mc, 4.5, {delay:-.9,x:"+=100",ease:Power2.easeOut}) tlheadline.to(this.yellowBar2_mc, 4.5, {delay:-4.5,x:"+=100", ease:Power2.easeOut}) tlheadline.to(this.engage_mc, .4, {delay:-2.3,alpha:0,ease:Sine.easeOut}) tlheadline.to(this.yellowBar2_mc, .4, {delay:-2.3,alpha:0,ease:Sine.easeOut}) Hopefully this is a simple solution. Thanks in advance. Animate.zip

Thank you for the advise

Hello Is it possible to create a shape mask, similar to how it was done in Flash where one shape overlaps/mask another shape? I have tried to use mask in the timeline (Animate timeline/layer) together with TweenMax but it does not seem to work. Very thankful for any advise.

Hello, I have this banner, which loops 3 time, and once the loops are finished I want it to play a new function. The code is fires the new function, but the Tween within the new function doesnt fires. This is the banner: http://mikaelfager.com/sun/Casino_generic_120x600.html Basically I want to flying objects to animate in and out of the canvas 3 times but the 4th time stop within the banner. Please let me know what I am doing wrong. Many thanks in advance. var tl3 = new TimelineMax({repeat:2,repeatDelay:0, onComplete:endFrame}) tl3.from(this.objects, 5, {delay:0,x:-67,y:536,scaleX:.4, scaleY:.4, alpha:1,ease:Quad.easeOut}) var tl = new TimelineMax({repeat:6,repeatDelay:1,yoyo:true}) tl.from(this.box1, .6, {scaleX:0, scaleY:0, alpha:1,ease:Back.easeOut}) .from(this.box2, .6, {delay:-.4,scaleX:0, scaleY:0, alpha:1,ease:Back.easeOut}) .from(this.cta, .6, {delay:.1,scaleX:0, scaleY:0, alpha:1,ease:Back.easeOut}) function endFrame(){ alert("Hello"); TweenLite.to(this.objects, 1.5, {x:0,y:400,scaleX:.4, scaleY:.4,}); }

I have created a simple banner with the following code: var tl = new TimelineMax({repeat:3,repeatDelay:10}) tl.from(this.box1, .6, {scaleX:0, scaleY:0, alpha:1,ease:Back.easeOut}) .from(this.box2, .6, {delay:-.4,scaleX:0, scaleY:0, alpha:1,ease:Back.easeOut}) .from(this.cta, .6, {delay:.1,scaleX:0, scaleY:0, alpha:1,ease:Back.easeOut}) The 3 movieclip animates in but not out, the animation just restarts. I would like the animation to reverse then restart 3 times but then stop before reversing the 3rd time. Is there a marker or label I could use to achieve this. NOTE: I am new to Greensock JS! Thanks