quick "flash" of content when using tween FROM?

[DG13]

Big thank you to everyone that makes this forum such a huge asset.

 

I'm having an issue with a Kiosk I'm working on. Basically i've built it with each "slide" on its own flash timeline frame. For each flash timeline frame I have a GS timelineMax to make everything awesome.

 

My issue is that when jumping to the next flash frame I get a momentary "flash" or blink of the content that is set to animate .from. it quickly goes away but is really unsightly.

 

 

here's an excerpt. any help would be greatly appreciated.

 

var timeline1:TimelineLite = new TimelineMax({ onComplete:goToTwo});

timeline1.append( TweenMax.from(FR1.MFPS, 2, {autoAlpha:0, rotationX:90, transformOrigin:"left top", ease:Elastic.easeOut, delay: 1}));
timeline1.append( TweenMax.from(FR1.p1, .5,  {autoAlpha:0, rotationY:90, transformOrigin:"left top", ease:Quint.easeIn, delay: .5}));
timeline1.append( TweenMax.from(FR1.Ba, 2,  {autoAlpha:0, rotationX:90, transformOrigin:"left top", ease:Elastic.easeOut, delay: -.05}));
timeline1.append( TweenMax.from(FR1.p2, .5, {autoAlpha:0, rotationY:90, transformOrigin:"left top", ease:Quint.easeIn, delay: .5}));
timeline1.append( TweenMax.from(FR1.ser, 2,  {autoAlpha:0, rotationX:90, transformOrigin:"left top", ease:Elastic.easeOut, delay: -.05}));

timeline1.append( TweenMax.from(FR1.equals, 1,{scrollRect:{x:0, y:0, width:0, height:140}, ease:Expo.easeInOut, delay: 0 })); 


function goToTwo(){
    this.gotoAndStop(2);
}
stop();

 

 

 

[DG13]

I realize this is probably happening on the frame enter while the content is still loading. Is there any way to work around this?  reformatting so everything is on one frame isn't an option.

[GreenSock]

I'm confused about the "transformOrigin" thing - why do you have that in there? This is a Flash project, right? The transformOrigin is for JavaScript when you're animating a DOM element. 

 

Anyway, it's tough to diagnose for sure without seeing your FLA and publishing it ourselves, but you're probably right about the problem being that the frame is still loading. Remember, Flash streams in content frame-by-frame, and it won't run any scripts on a frame until ALL of its contents have downloaded (for that particular frame). Normally it won't even go to a frame that's not fully loaded yet, except the first frame of course - that one just sits there while its assets are loading. So you might want to simply add one extra frame at the beginning of your FLA and put a stop() action there. Wait until your swf has loaded and then play(). You can loop on that frame and keep checking if bytesLoaded == bytesTotal. Or use the SelfLoader of LoaderMax (but that might be overcomplicating things if you're not using LoaderMax anywhere else). 

[DG13]

Jack,

 

Thanks for responding, I'll clean up the transform origin, I had it in there from the sample I found showing the y rotation transform.

 

This will be running in a flash projector on a kiosk, and It happens on each frame unfortunately not the first one.

 

Is there a way to send you the .fla file directly? I'm not comfortable posting it publicly even though its not confidential, I don't think my client would appreciate it.

[GreenSock]

Sure, you can send me a simplified file via a PM (private message) in the forums here. 

 

And you're using the latest version of the GreenSock files, right? 

 

This shouldn't be necessary because it's true by default for from() tweens, but try adding "immediateRender:true" in your tweens. Like:

 

timeline1.append( TweenMax.from(FR1.MFPS, 2, {autoAlpha:0, rotationX:90, transformOrigin:"left top", ease:Elastic.easeOut, delay: 1, immediateRender:true}));

[DG13]

It would seem that removing the transform origin code resolved the issue I was having!

 

Thank you very much for the support, and excellent product.