Search the Community

Sure, you can do pretty much all of that, but it's not something that should be in the core functionality of the tweening engine - you should do that stuff externally. It sounds like 2 functions would do pretty much all of what you wanted: //clones an generic object like the one typically passed into TweenLite/Max: function cloneObject(obj:Object):Object { var newObj:Object = {}; for (var p:String in obj) { newObj[p] = obj[p]; } return newObj; } //combines obj1 and obj2 (obj2 overwrites overlapping properties in obj1) function combine(obj1:Object, obj2:Object):Object { var newObj:Object = {}; var p:String; for (p in obj1) { newObj[p] = obj1[p]; } for (p in obj2) { newObj[p] = obj2[p]; } return newObj; } //creates a new vars object based on the current values in a tween (this does NOT work for plugin data like filters) function captureBasicState(tween:TweenLite):Object { var ignore:Object = {ease:1, delay:1, overwrite:1, onComplete:1, onCompleteParams:1, useFrames:1, runBackwards:1, startAt:1, onUpdate:1, onUpdateParams:1, roundProps:1, onStart:1, onStartParams:1, onReverseComplete:1, onReverseCompleteParams:1, onRepeat:1, onRepeatParams:1, proxiedEase:1, easeParams:1, yoyo:1, onCompleteListener:1, onUpdateListener:1, onStartListener:1, onReverseCompleteListener:1, onRepeatListener:1, orientToBezier:1, timeScale:1, immediateRender:1, repeat:1, repeatDelay:1, timeline:1, data:1, paused:1}; var newObj:Object = {}; for (var p:String in tween.vars) { if (!(p in ignore)) { newObj[p] = tween.target[p]; } } return newObj; } If you need to get the current state including plugin data, you'll need to write a more complicated function to parse that data specifically. Also, remember that in v11, you can pause() any tween and get/set its currentTime value. Render it at any point like myTween.currentTime = ANY_TIME. You can also reverse() anytime or create sequences with TimelineLite/Max. But if you're going in a lot of different directions with different properties and want to tween between disconnected spots in a sequence, you will probably need to use the methods above (or something similar) to track the various properties. Have fun

Found the Answer a little deeper down the board. viewtopic.php?f=1&t=2180 If anyone is curious, I just set my var openTimeline to have the {Reversed:true, Paused:true, repeat:0, yoyo:true, overwrite:true} so the animation would load, but you wouldn't see it until the button is clicked. Then when its click again, the animation plays in reverse. An so on, forever, until you get tired and stop clicking it. http://www.inmomentmedia.com/files/PV3D.fla.zip function yellowclickHandler(event:MouseEvent):void { if (openTimeline.reversed) { openTimeline.play(); } else { openTimeline.reverse(); } }

I think I figured out all the kinks, but Im still having one problem. Can you make one button, that when it's clicked it plays the timeline, then when its clicked again, the button play the timeline in reverse? btw sorry for not using these neat code boxes before. I didnt know. import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; import flash.events.MouseEvent; import flash.external.ExternalInterface; red_btn.addEventListener(MouseEvent.CLICK, clickButtonHandler); yellow_btn.addEventListener(MouseEvent.CLICK, yellowclickHandler); green.addEventListener(MouseEvent.ROLL_OVER, greenoverHandler); green.addEventListener(MouseEvent.ROLL_OUT, greenoutHandler); //GREEN BUTTON var myTimeline:TimelineMax = new TimelineMax({repeat:-1, yoyo:true, overwrite:false, paused:true}); myTimeline.insert( new TweenMax(asciitowel, 3, {y:-500, ease:Sine.easeInOut}) ); //GREEN BUTTON var myTimeline1:TimelineMax = new TimelineMax({paused:true, repeat:-1, yoyo:true, overwrite:true}); myTimeline1.insert( new TweenMax(paper, 1, {y:200, ease:Quad.easeOut}) ); myTimeline1.insert( new TweenMax(rainbow, 3, {y:250, ease:Elastic.easeOut}) ); myTimeline1.insert( new TweenMax(tree, 2, {y:200, ease:Bounce.easeOut}) ); function greenoverHandler(event:MouseEvent):void { myTimeline.play(); } function greenoutHandler(e:MouseEvent):void { myTimeline.reverse(); } //RED BUTTON function clickButtonHandler(e:MouseEvent):void { import flash.external.ExternalInterface; ExternalInterface.call("animatedcollapse.show('redbutton')"); ExternalInterface.call("animatedcollapse.hide('mainContent')"); //trace ("toggleDiv"); } //YELLOW BUTTON function yellowclickHandler(event:MouseEvent):void { myTimeline1.yoyo(); } When I try the myTimeline1.yoyo(); it says "inaccessible method" and myTimeline1.play(); obv just plays the animation once. or forever on repeat.

I'd be willing to bet there's something else in your code that's causing the problem - there are absolutely no known problems with tweens not actually completing before the onComplete is called. Nobody else has reported anything similar. Could you please post an FLA that demonstrates the issue? I'd also recommend reading up on the overwrite modes at http://blog.greensock.com/overwritemanager/ because maybe you're writing your tweens in a way that's causing them to get overwritten.

That's what the "index" property is for in any filter tween - it allows you to target a certain index in the DisplayObect's filters array. So your code would look like: _tween = new TweenMax(targetFrom, 0.2, { glowFilter: {index:1, color: 0xffffff, alpha: 1, blurX: 100, blurY: 100, strength: 2.5, quality:1}, ease: Linear.easeIn, delay:0.05, paused: true, overwrite:0 } ); _tween2 = new TweenMax(targetFrom, 0.2, { glowFilter: {index:0, color: 0x5EC5F7, alpha: 1, blurX: 100, blurY: 100, strength: 2, quality: 1}, ease: Linear.easeIn, paused: true, delay:0.05, overwrite:0 } ); Just be careful with the timing because if your object doesn't have any filters to start and you run the tween that targets index:1 first, that means the filters array would have an empty slot at the 0 position and Flash will thrown an error. Also keep in mind that in order for overwriting to function properly, tweens that are created later actually run first which is why I have index:1 above index:0 in the code.

Hi, I'm trying to create a tween where there are two glow filters. I know this is possible in AS3 but how do I do it in TweenMax? I've tried disabling overwrite with 2 tweens that are played at the same time. But it's not working since I can only see one glow filter applied. I have these tweens: _tween = new TweenMax(targetFrom, 0.2, { glowFilter: {color: 0xffffff, alpha: 1, blurX: 100, blurY: 100, strength: 2.5, quality:1}, ease: Linear.easeIn, delay:0.05, paused: true, overwrite:0 } ); _tween2 = new TweenMax(targetFrom, 0.2, { glowFilter: {color: 0x5EC5F7, alpha: 1, blurX: 100, blurY: 100, strength: 2, quality: 1}, ease: Linear.easeIn, paused: true, delay:0.05, overwrite:0 } ); and then there's _tween.play(); _tween2.play(); Thank you!

Yep, I noticed several issues: 1) Your onRollOver uses autoAlpha to fade the object out and toggle _visible to false, but when _visible is false, that triggers an onRollOut which starts fading in which toggles _visible back to true which triggers an onRollOver, etc. You've got an endless loop going. Just use _alpha instead of autoAlpha in this case to avoid the nasty loop. 2) As indicated in the docs, TweenLite will always overwrite all tweens of the same object when a new one is created by default. You have an onRelease that moves your button but also an onRollOut that spawns another tween of the same object which overwrites that onRelease one. You can use OverwriteManager to set the overwrite mode to AUTO - see http://blog.greensock.com/overwritemanager/ 3) You're using a stale version of the tweening engine (v10 or before). I'd highly recommend upgrading when you have a chance. Note that you'll need to change your import statements and activate the AutoAlphaPlugin. But there are a ton of enhancements in v11 that are probably worth the upgrade price (free) http://blog.greensock.com/v11/ Hope that helps.

I'm working on a horizontal scrolling news ticker and was wondering if someone could go over my code and help clean it up a bit. I'm fairly new to Actionscript 3 so I'm sure there are a lot of redundant areas in the code that could be optimized. Here is a working demo of what I have: http://www.info2gousa.com/news/News2.swf Here's my code and I have attached the source files: import com.greensock.*; import com.greensock.easing.*; //hides the image until it is loaded theImage.alpha=0; loadingBar.visible = false; //variables to hold the final coordinates of the image tween var finalX:Number; var finalY:Number; var endX:Number; var endY:Number; var pausedX:Number; var pausedY:Number; var beginX:Number; var beginY:Number; //variable to hold the number of images in the XML var listLength:Number; //keeps track of what image should be displayed var currPhoto:Number=0; //arrays to hold the contents of the XML, using this to allow //for the random order of the images var photoArray:Array = new Array(); var descriptionArray:Array = new Array(); var titleArray:Array = new Array(); //Loader event for the XML var loader:URLLoader = new URLLoader(); loader.addEventListener(Event.COMPLETE, onLoaded); var xml:XML; loader.load(new URLRequest("news.xml")); function onLoaded(e:Event):void { //load XML xml=new XML(e.target.data); var il:XMLList=xml.article; listLength=il.length(); populateArray(); } function populateArray():void { //takes the properties defined in the XML and stores them //into arrays var i:Number; for (i = 0; i < listLength; i++) { photoArray[i]=xml.article[i].photo; titleArray[i]=xml.article[i].title; descriptionArray[i]=xml.article[i].description; } beginImage(); } function beginImage():void { //grabs a random number between 0 and the number //of images in the array currPhoto=Math.floor(Math.random()*photoArray.length); //load title and description theTitle.text=titleArray[currPhoto]; theDescription.text=descriptionArray[currPhoto]; theImage.scaleX=1; theImage.scaleY=1; var imageLoader = new Loader(); //catches errors if the loader cannot find the URL path imageLoader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, catchFunction); //actually loads the URL defined in the image array imageLoader.load(new URLRequest(photoArray[currPhoto])); //adds a listener for while the image is loading imageLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, imgLoading); //adds a listener for what to do when the image is done loading imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, imgLoaded); function catchFunction(e:IOErrorEvent) { trace("Bad URL: " + photoArray[currPhoto] + " does not exist"); //take out the bad URL from the array photoArray.splice(currPhoto,1); titleArray.splice(currPhoto,1); descriptionArray.splice(currPhoto,1); //check to see if there are images left, //else restart the news ticker if (photoArray.length==0) { populateArray(); } else { beginImage(); } } function imgLoading(event:ProgressEvent):void{ //show the loading bar, and update the width //based on how much is loaded loadingBar.visible = true; loadingBar.bar.width = (event.bytesLoaded/event.bytesTotal)*100; } function imgLoaded(event:Event):void { loadingBar.visible = false; //add the image and get the dimensions to center the image theImage.addChild(imageLoader); //take the contents of the loaded image and cast it as bitmap data //to allow for bitmap smoothing var image:Bitmap = imageLoader.content as Bitmap; image.smoothing=true; //starting position of image theImage.x = (stage.stageWidth+10); theImage.y = (stage.stageHeight-71) - (imageLoader.content.height / 2); //paused position of image finalX = (142-imageLoader.content.height)/2; finalY = (stage.stageHeight-71) - (imageLoader.content.height / 2); //Ending position of image endX = ((0-stage.stageWidth)+10) - (imageLoader.content.width * .8 / 2); endY = (stage.stageHeight-71) - (imageLoader.content.height / 2); theDescription.x = (finalX*2)+imageLoader.content.width; theDescription.width = (stage.stageWidth - imageLoader.content.width) - (finalX*3); pausedX = theDescription.x; beginX = pausedX + 520; //start tween function easeIn(); } } function easeIn():void { TweenLite.to(theImage, 1.5, {x:finalX, y:finalY, onComplete:pauseCurrent}); TweenLite.to(theImage, 1, {alpha:1, overwrite:0}); TweenLite.from(theTitle, 1.5, {x:528, y:5}); TweenLite.to(theTitle, 1.5, {x:8, y:5, onComplete:pauseCurrent}); TweenLite.to(theTitle, 1, {alpha:1, overwrite:0}); TweenLite.from(theDescription, 1.5, {x:520+pausedX, y:44}); TweenLite.to(theDescription, 1.5, {x:pausedX, y:44, onComplete:pauseCurrent}); TweenLite.to(theDescription, 1, {alpha:1, overwrite:0}); } function pauseCurrent():void { TweenLite.to(theImage, 20, {onComplete:easeOut}); TweenLite.to(theTitle, 20, {onComplete:easeOut}); TweenLite.to(theDescription, 20, {onComplete:easeOut}); } function easeOut():void { TweenLite.to(theImage, 1.5, {x:endX, y:endY, alpha:0, onComplete:nextImage}); TweenLite.to(theTitle, 1.5, {x:-512, y:5, alpha:0}); TweenLite.to(theDescription, 1.5, {x:pausedX-520, y:44, alpha:0}); } function nextImage():void { //take out the image that was just displayed photoArray.splice(currPhoto,1); titleArray.splice(currPhoto,1); descriptionArray.splice(currPhoto,1); //remove the image theImage.removeChildAt(0); //start over if (photoArray.length==0) { populateArray(); } else { beginImage(); } } Thank you!

UPDATE: Hey thanks alot for your advice. which as you already know was right The problem with the buttons not working was obviously not tweenmax so I had to go back and look at my html, I was using a jQuery code to make the div's draggable and that was messing things up. (What a suprise?!) I found this post that kinda explained the problem. http://old.nabble.com/Embedded-Flash-Draggable-on-Safari-td19394706s27240.html? and the here is a 2mb fla of what im talking about. http://www.inmomentmedia.com/files/PV3D.fla.zip //code import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; import flash.events.MouseEvent; import flash.external.ExternalInterface; red_btn.addEventListener(MouseEvent.CLICK, clickButtonHandler); yellow_btn.addEventListener(MouseEvent.CLICK, yellowclickHandler); grass.addEventListener(MouseEvent.ROLL_OVER, greenoverHandler); grass.addEventListener(MouseEvent.ROLL_OUT, greenoutHandler); var myTimeline:TimelineMax = new TimelineMax({repeat:-1, yoyo:true, overwrite:false, paused:true}); myTimeline.insert( new TweenMax(asciitowel, 3, {y:-500, ease:Sine.easeInOut}) ); var myTimeline1:TimelineMax = new TimelineMax({paused:true}); myTimeline1.insert( new TweenMax(paper, 1, {y:200, ease:Quad.easeOut}) ); myTimeline1.insert( new TweenMax(rainbow, 3, {y:250, ease:Elastic.easeOut}) ); myTimeline1.insert( new TweenMax(tree, 2, {y:200, ease:Bounce.easeOut}) ); function greenoverHandler(event:MouseEvent):void { myTimeline.play(); } function greenoutHandler(e:MouseEvent):void { myTimeline.reverse(); } function clickButtonHandler(e:MouseEvent):void { import flash.external.ExternalInterface; ExternalInterface.call("animatedcollapse.toggle('mainContent')"); //trace ("toggleDiv"); } function yellowclickHandler(event:MouseEvent):void { myTimeline1.play(); //myTimeline1.toggle(); }

Hello everyone, I need small help with TweenLite. I'm trying to create animation on my MovieClip combining multiple TweenLite, but it doesn't behave as I hoped at start. TweenLite.to( mc, 0, {x:119.5, y:609 , overwrite:false} ); TweenLite.to( mc, 3, {y:136 , overwrite:false} ); TweenLite.to( mc, 0, {width:0, height:0 , overwrite:false, immediateRender:false , delay:3}); TweenLite.to( mc, 8, {width:200, height:200 , overwrite:false, immediateRender:false , delay:3}); Idea was to move movieClip out of the screen ( Tween with 0 duration ) and then during 3 sec interval to move it in predefined position. After that moviClip will "grow" from w=0,h=0 to w=200,h=200. Unfortunately it seams that leaving duration = 0, causes some problems, and mc after moving to position blinks, and start to change to w=200,h=200 from original size. Can any one help me with this? I tried to use TimelineLite, also to delay creation of TweenLite for defined delay ( emulating delay param passed to TweenLite) Thanks Andrija

For starters here is a link to the page that demonstrates my concern. http://www.erickjurado.com/pages/demopage.html If you notice, and the bottom right of the grid, there are two arrow buttons which are suppose to be the same size, but for some reason which I can't seem to figure out they are not appearing like they should.......One is smaller and another is squeezed. Now I've gone over my code, and I can't seem to figure out exactly what the issue is. I am using TimelineMax, which may or may not have to do with the issue. I also thought that perhaps it could be an Overwrite issue, but I have the Overwrite feature set to automatically overwrite anything. Here is the code. I've highlighted the code where the issue is appearing. import com.greensock.*; import com.greensock.easing.*; stop(); OverwriteManager.init(2); /////////////////LINES START////////////////////////////////LINES START////////////////////////////////LINES START/////////////// var thevertline:vertline = new vertline(); addChild(thevertline); thevertline.height = 1.0; thevertline.width = 1.25; thevertline.x = 23.5; thevertline.y = 193.5; thevertline.alpha = 0; /////////////MAIN SQUARES START////////////MAIN SQUARES START////////////MAIN SQUARES START////////////MAIN SQUARES START//////////// var felasquare:fela = new fela(); addChild(felasquare); felasquare.width = 0; felasquare.height = 0; felasquare.x = 59.2; felasquare.y = 164.8; felasquare.alpha = 0; felasquare.addEventListener(MouseEvent.ROLL_OVER, felaexpander); felasquare.addEventListener(MouseEvent.ROLL_OUT, defelaexpander); var selectasquare:selecta = new selecta(); addChild(selectasquare); selectasquare.width = 0; selectasquare.height = 0; selectasquare.x = 148.7; selectasquare.y = 164.8; selectasquare.alpha = 0; selectasquare.addEventListener(MouseEvent.ROLL_OVER, selectaexpander); selectasquare.addEventListener(MouseEvent.ROLL_OUT, deselectaexpander); var eddiesquare:eddie = new eddie(); addChild(eddiesquare); eddiesquare.width = 0; eddiesquare.height = 0; eddiesquare.x = 238.2; eddiesquare.y = 164.8; eddiesquare.alpha = 0; eddiesquare.addEventListener(MouseEvent.ROLL_OVER, eddieexpander); eddiesquare.addEventListener(MouseEvent.ROLL_OUT, deeddieexpander); var ebirdsquare:ebird = new ebird(); addChild(ebirdsquare); ebirdsquare.width = 0; ebirdsquare.height = 0; ebirdsquare.x = 327.6; ebirdsquare.y = 164.8; ebirdsquare.alpha = 0; ebirdsquare.addEventListener(MouseEvent.ROLL_OVER, ebirdexpander); ebirdsquare.addEventListener(MouseEvent.ROLL_OUT, deebirdexpander); var ss:sssquare = new sssquare(); addChild(ss); ss.width = 0; ss.height = 0; ss.x = 417.1; ss.y = 164.8; ss.alpha = 0; ss.addEventListener(MouseEvent.ROLL_OVER, ssexpander); ss.addEventListener(MouseEvent.ROLL_OUT, dessexpander); var ecuadorsquare:ecuador = new ecuador(); addChild(ecuadorsquare); ecuadorsquare.width = 0; ecuadorsquare.height = 0; ecuadorsquare.x = 506.5; ecuadorsquare.y = 164.8; ecuadorsquare.alpha = 0; ecuadorsquare.addEventListener(MouseEvent.ROLL_OVER, ecuadorsquareexpander); ecuadorsquare.addEventListener(MouseEvent.ROLL_OUT, deecuadorsquareexpander); var sevensquare:seveninch = new seveninch(); addChild(sevensquare); sevensquare.width = 0; sevensquare.height = 0; sevensquare.x = 59.2; sevensquare.y = 253.9; sevensquare.alpha = 0; sevensquare.addEventListener(MouseEvent.ROLL_OVER, sevensquareexpander); sevensquare.addEventListener(MouseEvent.ROLL_OUT, desevensquareexpander); var ejcardsquare:ejcard = new ejcard(); addChild(ejcardsquare); ejcardsquare.width = 0; ejcardsquare.height = 0; ejcardsquare.x = 148.7; ejcardsquare.y = 253.9; ejcardsquare.alpha = 0; ejcardsquare.addEventListener(MouseEvent.ROLL_OVER, ejcardsquareexpander); ejcardsquare.addEventListener(MouseEvent.ROLL_OUT, deejcardsquareexpander); var la:lasquare = new lasquare(); addChild(la); la.width = 0; la.height = 0; la.x = 238.2; la.y = 253.9; la.alpha = 0; la.addEventListener(MouseEvent.ROLL_OVER, laexpander); la.addEventListener(MouseEvent.ROLL_OUT, delaexpander); var garysquare:gary = new gary(); addChild(garysquare); garysquare.width = 0; garysquare.height = 0; garysquare.x = 327.6; garysquare.y = 253.9; garysquare.alpha = 0; garysquare.addEventListener(MouseEvent.ROLL_OVER, garysquareexpander); garysquare.addEventListener(MouseEvent.ROLL_OUT, degarysquareexpander); var corneliussquare:cornelius = new cornelius(); addChild(corneliussquare); corneliussquare.width = 0; corneliussquare.height = 0; corneliussquare.x = 417.1; corneliussquare.y = 253.9; corneliussquare.alpha = 0; corneliussquare.addEventListener(MouseEvent.ROLL_OVER,corneliussquareexpander); corneliussquare.addEventListener(MouseEvent.ROLL_OUT, decorneliussquareexpander); var bbooksquare:bbook = new bbook(); addChild(bbooksquare); bbooksquare.width = 0; bbooksquare.height = 0; bbooksquare.x = 506.5; bbooksquare.y = 253.9; bbooksquare.alpha = 0; bbooksquare.addEventListener(MouseEvent.ROLL_OVER,bbooksquareexpander); bbooksquare.addEventListener(MouseEvent.ROLL_OUT, debbooksquareexpander); var creative:creativetitlewords = new creativetitlewords(); addChild(creative); creative.alpha = 0; creative.width = 0; creative.height = 0; creative.x = 93.6; creative.y = 370.8; var nexter:nextbutton = new nextbutton(); addChild(nexter); nexter.height = 0; nexter.width = 0; nexter.x = 555.6; nexter.y = 367.9; nexter.alpha = 0; var mainmenu:mainmenubutton = new mainmenubutton(); addChild(mainmenu); mainmenu.height = 0; mainmenu.width = 0; mainmenu.x = 500; mainmenu.y = 367.9; mainmenu.alpha = 0; mainmenu.addEventListener(MouseEvent.CLICK, elclosing); var TheSquares:TimelineMax = new TimelineMax({delay:1,yoyo:false}); TheSquares.insert( new TweenMax (thevertline, .5,{alpha:1, height:80,ease:Cubic.easeOut})); TheSquares.insert( new TweenMax (thevertline, .95,{delay:.55, x:595.5,ease:Cubic.easeInOut})); TheSquares.insert( new TweenMax (felasquare, .75,{delay:1.25, alpha:1, width:85.2, height:85.2,ease:Back.easeOut})); TheSquares.insert( new TweenMax (selectasquare, .75,{delay:1.30, alpha:1, width:85.2, height:85.2,ease:Back.easeOut})); TheSquares.insert( new TweenMax (eddiesquare, .75,{delay:1.35, alpha:1, width:85.2, height:85.2,ease:Back.easeOut})); TheSquares.insert( new TweenMax (ebirdsquare, .75,{delay:1.40, alpha:1, width:85.2, height:85.2,ease:Back.easeOut})); TheSquares.insert( new TweenMax (ss, .75,{delay:1.45, alpha:1, width:85.2, height:85.2,ease:Back.easeOut})); TheSquares.insert( new TweenMax (ecuadorsquare, .75,{delay:1.5, alpha:1, width:85.2, height:85.2,ease:Back.easeOut})); TheSquares.insert( new TweenMax (thevertline, .75,{delay:2, y:245.8, height:183.5,ease:Cubic.easeOut})); TheSquares.insert( new TweenMax (thevertline, .75,{delay:2.30, y:279.8, height:80,ease:Cubic.easeOut})); TheSquares.insert( new TweenMax (thevertline, .89,{delay:2.78, x:24.5, ease:Cubic.easeInOut})); TheSquares.insert( new TweenMax (bbooksquare, .75,{delay:3, width:85.2, height:85.2, alpha:1,ease:Back.easeOut})); TheSquares.insert( new TweenMax (corneliussquare, .75,{delay:3.05, width:85.2, height:85.2, alpha:1,ease:Back.easeOut})); TheSquares.insert( new TweenMax (garysquare, .75,{delay:3.10, width:85.2, height:85.2, alpha:1,ease:Back.easeOut})); TheSquares.insert( new TweenMax (la, .75,{delay:3.15, width:85.2, height:85.2, alpha:1,ease:Back.easeOut})); TheSquares.insert( new TweenMax (ejcardsquare, .75,{delay:3.20, width:85.2, height:85.2, alpha:1,ease:Back.easeOut})); TheSquares.insert( new TweenMax (sevensquare, .75,{delay:3.25, width:85.2, height:85.2, alpha:1,ease:Back.easeOut})); TheSquares.insert( new TweenMax (thevertline, 1,{delay:4, height:0, alpha:0, ease:Cubic.easeOut})); TheSquares.insert( new TweenMax (creative, .75,{delay:4.05,alpha:1, width:113.8, height:24, ease:Back.easeOut})); TheSquares.insert( new TweenMax (mainmenu, .75,{delay:4.15, height:33.85, width:33.85, alpha:1, ease:Back.easeOut})); TheSquares.insert( new TweenMax (nexter, .75,{delay:4.15, height:33.85, width:35.85, alpha:1, ease:Back.easeOut})); function felaexpander(event:MouseEvent):void { TweenMax.to(felasquare, .25, {width:92.2,height:92.2, x:53.2, y:159.8, ease:Sine.easeInOut}); TweenMax.to(felasquare, .5, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function defelaexpander(event:MouseEvent):void { TweenMax.to(felasquare, 4, {width:85.2,height:85.2, x:59.2, y:164.8, rotation:0,ease:Elastic.easeOut}); TweenMax.to(felasquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function selectaexpander(event:MouseEvent):void { TweenMax.to(selectasquare, .25, {width:92.2,height:92.2, x:142.5, y:159.8, ease:Sine.easeInOut}); TweenMax.to(selectasquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function deselectaexpander(event:MouseEvent):void { TweenMax.to(selectasquare, 4, {width:85.2,height:85.2, x:148.7, y:164.8, rotation:0,ease:Elastic.easeOut}); TweenMax.to(selectasquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function eddieexpander(event:MouseEvent):void { TweenMax.to(eddiesquare, .25, {width:92.2,height:92.2, x:233, y:159, ease:Sine.easeInOut}); TweenMax.to(eddiesquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function deeddieexpander(event:MouseEvent):void { TweenMax.to(eddiesquare, 4, {width:85.2,height:85.2, x:238.2, y:164.8, rotation:0,ease:Elastic.easeOut}); TweenMax.to(eddiesquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function ebirdexpander(event:MouseEvent):void { TweenMax.to(ebirdsquare, .25, {width:92.2,height:92.2, y:159, x:320.6, ease:Sine.easeInOut}); TweenMax.to(ebirdsquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function deebirdexpander(event:MouseEvent):void { TweenMax.to(ebirdsquare, 4, {width:85.2,height:85.2, x:327.6, y:164.8, rotation:0,ease:Elastic.easeOut}); TweenMax.to(ebirdsquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function ssexpander(event:MouseEvent):void { TweenMax.to(ss, .25, {width:92.2,height:92.2, y:160, x:412, ease:Sine.easeInOut}); TweenMax.to(ss, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function dessexpander(event:MouseEvent):void { TweenMax.to(ss, 4, {width:85.2,height:85.2, x:417.1, y:164.8, rotation:0,ease:Elastic.easeOut}); TweenMax.to(ss, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function ecuadorsquareexpander(event:MouseEvent):void { TweenMax.to(ecuadorsquare, .25, {width:92.2,height:92.2, y:159, x:501, ease:Sine.easeInOut}); TweenMax.to(ecuadorsquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function deecuadorsquareexpander(event:MouseEvent):void { TweenMax.to(ecuadorsquare, 4, {width:85.2,height:85.2, x:506.5, y:164.8, ease:Elastic.easeOut}); TweenMax.to(ecuadorsquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function sevensquareexpander(event:MouseEvent):void { TweenMax.to(sevensquare, .25, {width:92.2,height:92.2, y:248.5, x:54, ease:Sine.easeInOut}); TweenMax.to(sevensquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function desevensquareexpander(event:MouseEvent):void { TweenMax.to(sevensquare, 4, {width:85.2,height:85.2, x:59.2, y:253.9, ease:Elastic.easeOut}); TweenMax.to(sevensquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function ejcardsquareexpander(event:MouseEvent):void { TweenMax.to(ejcardsquare, .25, {width:92.2,height:92.2, y:248.5, x:143.9, ease:Sine.easeInOut}); TweenMax.to(ejcardsquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function deejcardsquareexpander(event:MouseEvent):void { TweenMax.to(ejcardsquare, 4, {width:85.2,height:85.2, x:148.7, y:253.9, ease:Elastic.easeOut}); TweenMax.to(ejcardsquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function laexpander(event:MouseEvent):void { TweenMax.to(la, .25, {width:92.2,height:92.2, y:248.5, x:233.2, ease:Sine.easeInOut}); TweenMax.to(la, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function delaexpander(event:MouseEvent):void { TweenMax.to(la, 4, {width:85.2,height:85.2, x:238.2, y:253.9, ease:Elastic.easeOut}); TweenMax.to(la, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function garysquareexpander(event:MouseEvent):void { TweenMax.to(garysquare, .25, {width:92.2,height:92.2, y:248.5, x:322.2, ease:Sine.easeInOut}); TweenMax.to(garysquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function degarysquareexpander(event:MouseEvent):void { TweenMax.to(garysquare, 4, {width:85.2,height:85.2, x:327.6, y:253.9, ease:Elastic.easeOut}); TweenMax.to(garysquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function corneliussquareexpander(event:MouseEvent):void { TweenMax.to(corneliussquare, .25, {width:92.2,height:92.2, y:248.5, x:412.1, ease:Sine.easeInOut}); TweenMax.to(corneliussquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function decorneliussquareexpander(event:MouseEvent):void { TweenMax.to(corneliussquare, 4, {width:85.2,height:85.2, x:417.1, y:253.9, ease:Elastic.easeOut}); TweenMax.to(corneliussquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function bbooksquareexpander(event:MouseEvent):void { TweenMax.to(bbooksquare, .25, {width:92.2,height:92.2, y:248.5, x:501.1, ease:Sine.easeInOut}); TweenMax.to(bbooksquare, .5, {bevelFilter:{blurX:20, blurY:20, strength:2, angle:-300, highlightcolor: 10, highlightAlpha:.15, shadowAlpha:.15,distance:3}}) } function debbooksquareexpander(event:MouseEvent):void { TweenMax.to(bbooksquare, 4, {width:85.2,height:85.2, x:506.5, y:253.9, ease:Elastic.easeOut}); TweenMax.to(bbooksquare, .25, {bevelFilter:{blurX:10, blurY:10, strength:.5, angle:150, highlightcolor:5, highlightAlpha:1, shadowAlpha:.5,distance:2}}); } function elclosing(event:MouseEvent):void { this.parent.parent.removeChild(this.parent); } I am still relatively new to AS3 so there is probably something that I am overlooking here. If a more "seasoned vet" could maybe have a look, and help me out that would help me out huge. Thanks in advance for any sort of help!!

Hi, I was trying to cancel a glow after its done using the remove:true propety but it doesnt work, it doesnt remove it. This is the code: import com.greensock.*; TweenMax.to(mc1, .1, {glowFilter:{color:0x91e600,alpha:1, blurX:5, blurY:5,strength:10},remove:true,overwrite:0}); Any idea why it is not working? Thanks

Hi, Excuse my ignorance but what would be the best way to reuse my tweens? In other words I have some tweens and I would like to apply them to multiple movieClips (mc1, mc2, mc3, mc4...) without having to re-write my tweens over and over. I know this is more of an actionscript question but if someone can halp me to minimize the amount of code it would be great. TweenLite.to(mc1, .8, {x:300}); TweenLite.to(mc1, 1, {delay:.8, scaleX:2,scaleY:2,overwrite:0}); TweenLite.to(mc1, 1, {delay:2.1, scaleX:1,scaleY:1,overwrite:0}); TweenLite.to(mc1, .8, {delay:2.9, x:560,overwrite:0}); TweenMax.to(mc1, .1, {delay:1.6, glowFilter:{color:0x91e600,alpha:1, blurX:5, blurY:5,strength:10},remove:true,overwrite:0}); I would like to use this set of tweens for mc2, mc3 etc. Thanks

I noticed a few things: 1) There's really no reason to use overwrite:0 with TweenMax (at least I can't think of one). It uses AUTO mode by default which intelligently figures out when to kick in (only when you're doing two tweens of the same object at the same time) 2) You paused your tweens that were inserted into your timeline. That paused state is honored even if you play the tween's parent timeline. Basically, think of TimelineLite/Maxes as the clock by which their child tweens rely for timing - if you pause/stop the timeline, that stops the clock which in turn appears to pause the child tweens (even though their "paused" property technically hasn't been set to true). This may seem slightly odd at first, but trust me - it is the most straightforward way to do it and engineering it a different way would cause much more significant problems. In any case, the point is that you should NOT pause your tweens. Just pause the TimelineMax instance instead.

Sorry, I should have explained that first. Ok here goes. I have a row of thumbnail images which use the ENTER_FRAME event to move to the left or to the right depending on mouseX. I wanted to stop this movement when the beginning/end is reached using tweens: var myTimeline:TimelineMax = new TimelineMax(); myTimeline.append(new TweenMax(thumbnailBar, 0.2, {x:0, ease:Quad.easeOut, paused:true, overwrite:0})); myTimeline.addLabel("smoothLeftScroll", 0); myTimeline.append(new TweenMax(thumbnailBar, 0.2, {x:(thumbnailArea.x - thumbnailBar.width + thumbnailArea.width), ease:Quad.easeOut, paused:true, overwrite:0})); myTimeline.addLabel("smoothRightScroll", 0.2); function thumbGallery(e:Event):void { /* some code here */ if (thumbnailBar.x > 5.7 * prevDiff && prevDiff < 0) // beginning reached. prevDiff < 0 means thumbnailBar moves to the left. { myTimeline.gotoAndStop("smoothLeftScroll"); myTimeline.tweenTo("smoothRightScroll"); } else if (thumbnailArea.x - thumbnailBar.width + thumbnailArea.width - thumbnailBar.x > -5.7 * prevDiff && prevDiff > 0) // end reached { myTimeline.gotoAndPlay("smoothRightScroll"); } else { thumbnailBar.x -= prevDiff; } var a:Array = myTimeline.getActive(); for (var i:Number = 0; i < a.length; i++) { trace(a[i].target + " is tweening"); } } I'm guessing this does not run properly because "myTimeline" is called multiple times. "TweenMax(thumbnailBar, 0.2, {x:0, ease:Quad.easeOut, paused:true, overwrite:0})" doesn't seem to help either. So my idea was to use "getActive()" and call "myTimeline" only when there are no tweens running already.

ok! thanks for the reply!! I don't really get it to work though, the error i'm getting is: 1120: Access of undefined property e. (for this: var myTween:TweenMax = new TweenMax(e.target.textbox_mc, 1, { x:0, y:0, alpha:1, overwrite:2, paused: true}) 1061: Call to a possibly undefined method play through a reference with static type gs:TweenMax. (for myTween.play() Where should I put the var myTween:TweenMax = new TweenMax etc..? right now its at the place where I declare my variables.. I tried put it in a function but that didn't work either...

First of all, when you're using TweenMax, you shouldn't ever need to include overwrite:0 because it automatically uses the AUTO overwrite mode which is intelligent enough to figure out overlapping properties and times and only kills stuff when necessary. Regarding the argument error, you must be passing the wrong number of arguments to a function. I couldn't tell by the very small code snippet you pasted in here - it must be somewhere else in your code. I would recommend separating your questions into the most short, succinct ones possible and post each one separately in the forums. You put a bunch of questions in one post and it was a bit difficult to follow it all. It's also always best to try to isolate the issues in their own SUPER simple FLA files. For example, if you're having trouble with a rollover/out and a click handler getting mixed up, create a separate FLA with one button that you try your rollover with. If that works, then add the rollout. If that works, add the click. Add layer upon layer until it breaks and then you'll have a much better idea of what's going on. Use trace() a lot to print values to the screen at runtime so you can see what's going on under the hood. Hope that helps.

What is the syntax to set the timescale? There are no code samples in the documentation. It is hard for me to figure it out from: my code: var timeline:TimelineLite=new TimelineLite(); timeline.insert(TweenLite.to(bodyCopy.eatingRight_txt, 2, {alpha:1,x:60,delay:3,overwrite:false,ease:Quad.easeInOut})); timeline.insert(TweenLite.to(bodyCopy.forLife_txt, 1, {alpha:1,y:49,delay:4,overwrite:false,ease:Quad.easeInOut})); timeline.insert(TweenLite.to(slide1, 1.5, {scaleX:1.3, scaleY:1.3,x:"50",y:"50",delay:2.5,overwrite:false,ease:Quint.easeIn})); timeline.insert(TweenLite.to(slide1, 12, {scaleX:1, scaleY:1,delay:4,x:centerX,y:centerY,overwrite:false,ease:Quint.easeOut})); timeline.insert(TweenLite.to(bodyCopy.eatingRight_txt, 1, {x:126,y:-25.1,scaleX:.38,scaleY:.38,tint:0xa62912,delay:7.5,overwrite:false,ease:Quad.easeIn,onComplete:antiAliasMe,onCompleteParams:[bodyCopy.eatingRight_txt]})); timeline.insert(TweenLite.to(bodyCopy.forLife_txt, 1, {x:197,y:-25.1,scaleX:.20,scaleY:.20,delay:8,overwrite:false,ease:Quad.easeIn,onComplete:antiAliasMe,onCompleteParams:[bodyCopy.forLife_txt]})); timeline.insert(TweenLite.to(slide1, 1, {alpha:0,delay:9,overwrite:false,ease:Quint.easeOut}));

You use a local variable in your mouse over handler. Local variables will not be accessible elsewhere in your code. So you have to declare your myTween variable outside of your mouse over function. I encourage the following: var myTween:TweenMax = new TweenMax(e.target.textbox_mc, 1, { x:0, y:0, alpha:1, overwrite:2, paused: true}); function onMouseOver(e:MouseEvent):void { myTween.play(); } function onMouseOut(e:MouseEvent):void { myTween.reverse(); } trispo

Hi I'm trying to use the revese function but I get an error saying that the "1120: Access of undefined property myTween." thats for the mouse out function here is the code: this is on a mouse over: var myTween:TweenMax = new TweenMax(e.target.textbox_mc, 1, { x:0, y:0, alpha:1, overwrite:2}); on mouse out myTween.reverse() does anybody see what i'm doing wrong? thanks! /peter

I don't see any obvious problems, but it's tough to tell exactly what about_dd and e.currentTarget refer to (could they ever be the same thing?). I'd need to see the rest of your code and your FLA to know for sure, but you're welcome to try overwrite:1 to see if it solves your problems. Again, I don't see any obvious errors though, nor do I see an obvious reason for using overwrite:1 (not that it's bad). The problem may have something to do with the fact that you're changing the level with setChildIndex(about_dd,numChildren - 1) - have you tried removing that just to test?

is this an instance that i would use the overwrite:1. I am having issue when a user moves their mouse over the button it gets stuck in the over state. this is a drop down menu when.. function aboutOver(event:MouseEvent){//MAIN BUTTONS var aboutOver:TimelineMax = new TimelineMax(); aboutOver.insert(TweenMax.to(event.currentTarget, .5, {glowFilter:{color:0xc8db00, alpha:1,blurX:15, blurY:15, inner:true}})); aboutOver.insert(TweenMax.to(about_dd, .5, {alpha:1, visible:true})); setChildIndex(about_dd,numChildren - 1); } function aboutOut(event:MouseEvent){//MAIN BUTTONS TweenMax.to(event.currentTarget, .5, {glowFilter:{color:0xc8db00, alpha:0, blurX:0, blurY:0}}); } function dropOut(event:MouseEvent){ TweenMax.to(about_dd, .5, {alpha:0, visible:false}); }

When you set overwrite to 0 (or false), you're telling it NOT to look for any overlapping tweens to kill - it will allow multiple tweens of the same object to exist which can lead to exactly the problem you're describing. Imagine you start tweening mc.x to 100 over the course of 1 second, but then you immediately start another tween of mc.x to 0 over the course of 0.5 seconds. Both tweens would fight for the first 0.5 seconds (with the 2nd one winning) and then when the 2nd one finishes, the first one is still going so it would suddenly jump to halfway done with the first tween to 100. The moral of the story: be very careful when setting overwrite to 0. You're taking full responsibility of managing your tweens in that case. It's usually much better to either use the AUTO mode (2) or the ALL_IMMEDIATE mode (1). If you don't have any other tweens affecting other properties of the object, I'd recommend using overwrite:1 because it's faster than AUTO. It's perfect for button rollover/outs. But AUTO is extremely convenient. Why did you set overwrite:0 in the first place? Is there a reason you didn't just leave it in the default AUTO mode?

so, i have done this: import gs.OverwriteManager; OverwriteManager.init(); and i have one object and 2 possible tweens affecting it, one moving it in one direction, other reversing it. the code doesnt really mater, the important thing is that its affecting the same object. function showTextInfo():void { TweenLite.to(activeSong_mc, _switchTextInfoTime, { y: _infoDownY, onComplete: startTextInfoTimer, overwrite: 0 }); } function hideTextInfo():void { TweenLite.to(activeSong_mc, _switchTextInfoTime, { y: _infoUpY, onComplete: afterCloseInfoHandler, overwrite: 0 }); } i have some nasty bug in my code and i dont know if this is normal or what... does having OverwriteManager to NONE means that each tween will finish before going to the next one? the problem is that sometimes (i am still having hard time to figure out when exactly), when i am constantly calling these same tweens, the tween like skippes quickly to the next one (or sometimes even looks like it was never there...), although it should be lasting the predefined time....

Tough to say for sure what's going on with your file, but did you realize that the following code just creates 100 duplicate tweens that overwrite each other? var i:int = 0; for ( i=0; i TweenMax.to(b, 2, {x:319, y:275}); TweenMax.to(b, 1, {x:442, y:406}); } That's a big waste of resources. If you're still running into trouble, please post a simple Flex project archive or FLA file that demonstrates the issue.