Jump to content

Search the Community

Showing results for tags 'oncomplete'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 / JS
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

Found 72 results

  1. Hey everyone so In my Movie Clip class I have the Object move to the Right side of the stage using TweenLite and after the tween is finished I want the function "OnComplete" to remove the object but its not doing anything and the object is still on stage. Here is how I am using it: TweenLite.to(this, 3.0, { x: 900, y: 300, onComplete:removeTween } ); Then the Function: private function removeTween():void { if (this.parent) { parent.removeChild(this); } } Does anyone know why its not removing the object from the stage?
  2. Why doesn't 'myFunction()' fire at the end of this? (simple scroll-to-section) $('a.trigger').bind('click',function(event){ event.preventDefault(); var $anchor = $(this); var scrollY = $($anchor.attr('href')).offset().top - 100; TweenLite.to($(window), 1.6, {scrollTo:{ y:scrollY, onComplete:myFunction, ease:Power2.easeInOut }}); function myFunction(){ alert('done'); } }); Something to do with the scrollTo plugin??? I am confused...I have tried putting onComplete outside of the scrollTo:{} brackets, still nothing... what's up? Thank you very much for any help! Luke
  3. I have a separate stepped animation that I am using on the onComplete of the TweenMax animations and it works great everywhere except the first 5 animations. Here is the code excerpt. The last onComplete will fire causing all previous onComplete's to fire. function treeanimation(treeFrame){ bgPos = treeFrame*211; $("#plant").css('background-position', '0px -'+bgPos+'px'); } var controller = $.superscrollorama({}) controller.pin($('#slides'), aniDur,{ anim: (new TimelineLite()) .append([ TweenMax.to($('#slide1-bg'), .5, {css: { top:"100%" }, onComplete: function(){ treeanimation(1); }, onReverseComplete: function() { treeanimation(0); } } ), TweenMax.to($('#slide1-content'), .5, {css: { top:"-50%", display: "none" }, onComplete: function(){ treeanimation(2); }, onReverseComplete: function() { treeanimation(1); } } ), TweenMax.to($('#slide1-body'), .5, {css: { display:"none" }, onComplete: function(){ treeanimation(3); }, onReverseComplete: function() { treeanimation(2); } } ), TweenMax.to($('#slide2-content'), .5, {css: { marginTop:"20%" }, onComplete: function(){ treeanimation(4); }, onReverseComplete: function() { treeanimation(3); } } ), TweenMax.to($('#slide2'), .5, {css: { top:"0" }, onComplete: function(){ $("#slide2-nav").html('<img src="img/active-btn.png" alt="Slide 2">') $("#slide2-nav").parent().addClass('active') treeanimation(5); }, onReverseComplete: function(){ $("#slide2-nav").html('<img src="img/inactiv-btn.png" alt="Slide 2">') $("#slide2-nav").parent().removeClass('active') treeanimation(4); } } ) ]) .append([ TweenMax.to($('#slide2'), .5, {css: { right:"-100%" }, onComplete: function(){ treeanimation(6); }, onReverseComplete: function() { treeanimation(5); } } ), TweenMax.to($('#slide2-content'), .5, {css: { marginLeft:"-90%", display: "none" }, onComplete: function(){ treeanimation(7); }, onReverseComplete: function() { treeanimation(6); } } ), TweenMax.to($('#slide3'), .5, {css: { left: "0%" }, onComplete: function(){ $("#slide2-nav").html('<img src="img/inactiv-btn.png" alt="Slide 2">') $("#slide3-nav").html('<img src="img/active-btn.png" alt="Slide 3">') $("#slide3-nav").parent().addClass('active') $("#slide2-nav").parent().removeClass('active') treeanimation(8); }, onReverseComplete: function(){ $("#slide3-nav").html('<img src="img/inactiv-btn.png" alt="Slide 3">') $("#slide2-nav").html('<img src="img/active-btn.png" alt="Slide 2">') $("#slide3-nav").parent().removeClass('active') $("#slide2-nav").parent().addClass('active') treeanimation(7); } } ), TweenMax.to($('#slide3-content'), 0.5, {css: { marginLeft: "10%" }, startAt: {css: { marginLeft: "110%" } }, onComplete: function(){ treeanimation(9); }, onReverseComplete: function() { treeanimation(8); } } ), ]) Any Help would be greatly appreciated. This is integrated with SuperScrollerama
  4. Hi, I am trying to create a timeline that contains an ending pause of x seconds: now I can add a delay between tweens, a delay before a specific tween, but... how do I set a delay before onComplete is triggered? I could add a dummy tween at the end of the timeline, with a delay, but it look ugly to me. Am I missing the specific trick? Thanks
  5. TweenMax.staggerTo (pantalla_musica, 6, {_y:"-500", ease:Power2.easeInOut, onComplete:activar, onCompleteParams: ["{self}"]}, 0.4, mc ); The tween runs an array that contains 5 movieclips. In one hand, there is a "onComplete" that invokes an animation for each of the movieclips of the array. In the other hand, there is a "onComlpeteAll" at the end of the code-line, which tells the tween to run a trace, once all the animations have finished. The trace happens, but the last movieclip of the array doesn't run. However, when i delete "onCompleteall" (mc) the last moveclip of the array does run, just like the others. don't have a clue what could it be. Experts?
  6. I have five movieclips, with different instances, since i would want to use them as buttons later with different actions. (let's call them mc_1, mc_2, mc_3, mc_4, and mc_5) Each of this moveclips will share the same tween for movement. Now, here comes the tricky part -for me- : Each movie clip, share a common nested-moviecli. It is the same instance for all of them. Let's call it inner_animation. What i want to do, is to tell each movie clip (mc_1, mc_2 ...) to run inner_anmation once the tween has completed. Here is an example for what i have for mc_1: import com.greensock.TweenLite; import com.greensock.easing.*; TweenLite.to( mc_1, 0.5, {_x:"200", _y:"100", ease:Strong.easeOut, onComplete:RunInnerAnimation} ); function RunInnerAnimation() { TweenLite.to( mc_1.inner_animation, 1, {_x:"50", _y:"50", ease:Regular.easeOut} ); } As you can see this method wont work, since i would have to write one function for each moveclip. I was thinking something like: This.inner_animation but couldnt make it work. Any smart guy out there?
  7. First of all, I would like to say thank you to the author, this is the best Tweening platform available, and I'm happy as paid customer. i always do this when i need to add a delay before onComplete callback triggered : var timeline:TimelineMax = new TimelineMax({paused:true,onComplete:completeHandler}); timeline.append(TweenMax.to(...})); timeline.append(TweenMax.to(...})); timeline.append(TweenMax.to(...})); timeline.append(TweenMax.to(this,1,{})); //adding delay before onComplete triggered timeline.play(); i was wondering is there any better solution to this? Cheers!
  8. Hi, I am working on a flash training presentation including a number tweens which need to appear one after another, mainly texts and some photos flying in or fading out while trying to control the timing of the elements with delay property. I have noticed however that when "delay" used in conjunction with "onComplete" callbacks the delays are somewhat missing and not processed. So instead of delaying the start of the animation and then only do onComplete when it ends it seems like the script is disregarding the delay properties an proceeds immedeately with onComplete callback functions. Please see example below: //animations part 1 TweenLite.to(girl, 1, {_alpha:100, ease:Linear.easeNone, delay:1.5}); TweenLite.to(planTab, 0.7, {_y:417, ease:Linear.easeNone, delay:3.5}); TweenLite.to(text_1, 0.5, {_x:394, _alpha:100, ease:Linear.easeOut, delay:4}); TweenLite.to(text_2_Anim, 0.5, {_x:395, _alpha:100, ease:Linear.easeOut, onComplete:myFunction1, delay:4.3}); //animations part 2 - need to start with about 2 second delay after previous set so the previous texts can be read function myFunction1() { TweenLite.to(text_2_Anim, 0.5, {_x:435, _alpha:0, ease:Linear.easeOut, delay:2.5, onComplete:text_2_Anim.nextFrame()}); TweenLite.to(text_2_Anim, 0.5, {_x:395, _alpha:100, ease:Linear.easeOut, delay:3}); TweenLite.to(benefitsTab, 0.5, {_alpha:100, ease:Linear.easeNone, onComplete:myFunction2, delay:3}); } //animations part 3 function myFunction2() { //more tweens here. } Any ideas on why it is happening? Thanks, Attila
  9. Hi all! Today I was trying to execute some instructions on manual scroll event, avoiding the scroll animation performed by TweenMax. I attempted to initialize a boolean variable, which is false during the TweenMax animation and is restored to true "onComplete". On $(window).on("scroll") I checked the status of the variable. I found out that a scroll even was triggered even when my status variable was already returned to true: after some tests, it turns out that it's TweenMax itself. I tried on an empty page, reporting the following code in Firebug console, and looks like after the "hi" reported by TweenMax onComplete, another scroll event is triggered. $(window).on("scroll", function(){console.log ("scroll");}); TweenMax.to(window, 1, { scrollTo: { y: 500 }, ease: Linear.easeNone, onComplete: function () { console.log("hi!"); } }); I wouldn't expect this behavior: why does this happen? Thanks in advance! Massi
  10. Hi there, and thank you for these fine greensock tween engines. Can't imagine how many flash banners I've made importing that com.greensock package. So let's cut to the chase, I've started using greensock for html-banners as well and ran through a problem. TweenLite onComplete triggers right away. I've searched the forums and all but didn't find anything on this. Here's the (stripped) code that's not working: function init() { TweenLite.to('#frame1', .3, {opacity: 1, delay: 0, onComplete: arrowLoop, onCompleteParams:[arrow1]}) TweenLite.from('#arrow2', .3, {opacity: 0, top:"-=10",delay: 10, onComplete: arrowLoop, onCompleteParams:[arrow2]}) } In arrowLoop(arrow) function I logged the arrow and it traces right away the latter arrow2 twice before the arrowLoop is called for arrow1. If I comment the latter tween out then the arrowLoop works just fine. This one works correctly: function init() { TweenLite.to('#frame1', .3, {css:{opacity: 1}, delay: 0}) TweenLite.delayedCall(.5, arrowLoop, [arrow1]); TweenLite.from('#arrow2', .3, {css:{opacity: 0, top:"-=10px"},delay: 10}) TweenLite.delayedCall(10.3, arrowLoop, [arrow2]); }
  11. import com.greensock.*; TweenLite.from( test, 2, { x: 1000, onComplete: onCompleteHandler } ); function onCompleteHandler() : void { trace( 'hit' ); } Is onComplete when using "from" intended to fire before and after? Because it is.
  12. Hi, As this is my very first post: Awesome work, Greensock. Playing around with GSAP makes the sun shine in me (as an ex flash animator) and I wish I had it discovered earlier. I'm throwing in my first experiment: multiple infinite moving backgrounds at different speed combined with CSS keyframe animation to create cycles. I have a bit of trouble with the following. Please have a look at http://goo.gl/1jCPK My code for the bird: tween = TweenMax.to(bird, 2, {css:{left:"300px", top:"-50px"}, ease:Linear.easeNone}); tween2 = TweenMax.to(bird, 1, {css:{left:"2000px", top:"-300px"}, ease:Linear.easeNone, onComplete:myFunction}); function myFunction() { TweenMax.to(bird, 0, {css:{left:"-300px", top:"-50px"}, ease:Linear.easeNone}); } tween.pause(); tween2.pause(); bringBtn.onclick = function() { tween.play(); } revBtn.onclick = function() { tween.reverse(); } byeBtn.onclick = function() { tween2.play(); } 1. Clicking on the "bye bird" button makes the bird fly away. I can't manage to bring it back by clicking "call bird" button. I guess I do something wrong in the onComplete function? I thought bringing it back to the original position after the tween is finished would suffice? 2. It runs pretty smooth on a dual core laptop, but very choppy on iOS devices (and I suppose android as well). Even the latest quadcore ipad shows it choppy. Any tips to optimize this type of animation? I'm testing how far I can go with this engine. Please note I'm not a great coder, I design and write mainly CSS/HTML and only wade my feet in JS. So I'm all ears to learn and share problems with others here that might have similar issues. Thanks a lot! S
  13. I know I am missing something here, can I have an onComplete call in a Trasform Matrix tween? Here is what I have import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.TransformMatrixPlugin; TweenPlugin.activate([TransformMatrixPlugin]); TweenMax.to(mc, 2, {transformMatrix:{rotation:-15, ease:Quad.easeInOut, onComplete:myFunction}}); The tween works nicely but just dead ends on the end never calling myFunction
  14. Hello, I know it's possible to have mixed xml (with loader's and also other content), but I'm having trouble working out how to access XML in LoaderMax before child loaders have finished. For example, here's a simple version of my xml: <?xml version="1.0" encoding="utf-8"?> <content> <preload> <LoaderMax name="..." prependURLs="assets/" load="true"> <MP3Loader name="..." url="..." autoPlay="false"/> <ImageLoader name="..." url="..."/> </LoaderMax> </preload> <fonts> <LoaderMax name="..." prependURLs="assets/" load="true"> <SWFLoader name="..." url="..."/> <SWFLoader name="..." url="..."/> </LoaderMax> </fonts> <main> <prompts>Some other content</prompts> ... </main> </content> All good so far. I get an onChildComplete event for each item loaded, plus one for each LoaderMax itself. Once everything is loaded, I get an onComplete event. But... I really need an event for the XML file itself. I can access it once everything else has loaded, but I really need to access it before the load has completed (I'm assuming it's the first thing loaded?). Is this possible? I really hope it is!
  15. Hi, I am writing pretty simple game that utilizes MVC pattern. Model is calculating data stored in Array and dispatches events to View that tries to reproduce and visualize it. I wanted to implement View in the way that TimelineMax is handling the tweens by queing it up and play it at the certain point of time. Here is the mainLoop from Model public function mainLoop():void { applyBonus(bonuses); fall(); applyBonus(bonuses); dispatchEvent(new Event(BoardModel.PLAY)); } the function applyBonus or fall just dispatches appropriate events to View. The listeners to this methods just create Tweens and are adding them to the TimelineMax using the append method. The problem is that each on this tweens has a its onComplete method. I want to make sure that not only twees are executed in correct order but also onComplete. Currently I have: applyBonus tween fall tween applyBonus onComplete fall onComplete I wish to have: applyBonus tween applyBonus onComplete fall tween fall onComplete etc. How can I achieve something like this?
  16. Hey, I know this tweening engine is the best. But, until yesterday i found something weird, the onComplete event does not fire. here is my code: import flash.events.MouseEvent; import flash.display.Loader; import flash.events.Event; import flash.net.URLRequest; import flash.display.MovieClip; import flash.display.StageScaleMode; import flash.display.StageAlign; import com.greensock.TweenMax; stop(); stage.scaleMode = StageScaleMode.NO_SCALE; stage.align = StageAlign.TOP_LEFT; var basePath:String = "projects/"; var projectName:String = "Mandiri/"; var theSWF:String = ""; banners.banner1.addEventListener(MouseEvent.CLICK, onClick); banners.banner2.addEventListener(MouseEvent.CLICK, onClick); banners.banner3.addEventListener(MouseEvent.CLICK, onClick); banners.banner4.addEventListener(MouseEvent.CLICK, onClick); function onClick(me:MouseEvent):void{ //trace(sub_container.numChildren); if(sub_container.numChildren > 0){ TweenMax.to(sub_container.getChildAt(0), 1, {alpha:0, onComplete:clearChildren, onCompleteParams:["Yayy"]}); } switch(me.currentTarget.name){ case "banner1": theSWF = "01.swf"; break; case "banner2": theSWF = "02.swf"; break; case "banner3": theSWF = "03.swf"; break; case "banner4": theSWF = "04.swf"; break; } var swfLoader:Loader = new Loader(); swfLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoadSubComplete); swfLoader.load(new URLRequest(basePath + projectName + theSWF)); } function clearChildren(param):void{ trace(param); TweenMax.killTweensOf(sub_container); sub_container.removeAllChildren(); trace(sub_container.numChildren); } function onLoadSubComplete(ev:Event):void{ var theLoaded:MovieClip = MovieClip(ev.target.content); theLoaded.x = -theLoaded.width/2; theLoaded.y = -theLoaded.height/2; sub_container.addChild(theLoaded); TweenMax.to(theLoaded, 1, {alpha:1}); } stage.addEventListener (Event.RESIZE, resizeListener); function resizeListener(ev:Event):void{ sub_container.x = stage.stageWidth/2; sub_container.y = stage.stageHeight/2; banners.x = stage.stageWidth/2 - banners.width/2; } DisplayObject.prototype.removeAllChildren = function(){ for(var j = this.numChildren-1; j >= 0; j--){ this.removeChildAt(j); } } If you see that onComplete:clearChildren, onCompleteParams:["Yayy"] inside onClick function, it does not fire. But when I try onStart event, it fired perfectly normal. Please help, thanks before. And sorry, for my bad english.
  17. Hi folks, I am not really new to this, but I get a hard time trying to do the following: I got an array of MCs named "stepArray". I want to animate through it after a dice function which gives me a number between 1 and 6 (if 5, the stepArray will have 5 elements and so on). Whatever, I need to know when the last element of the array has finished tweening, because that is the time the dice can be used again and is set free. If you need more input, please reply. function animatePlayerMove ():void { tweenScaleUp(); } function tweenScaleUp():void { TweenMax.allTo(stepArray, tweenSpeed, {alpha:1, scaleX:1.5, scaleY:1.5, dropShadowFilter:{blurX:15, blurY:15, distance:5, alpha:0.33}, ease:Cubic.easeInOut, onComplete:tweenScaleDown}, stepStaggerAmount); } function tweenScaleDown():void { tma = TweenMax.allTo(stepArray, 0.2, {alpha:1, scaleX:1, scaleY:1, dropShadowFilter:{blurX:5, blurY:5, distance:5, alpha:0.33}, ease:Cubic.easeInOut}, stepStaggerAmount); addEventListener(Event.ENTER_FRAME, checkStepAnimationprogress); } function checkStepAnimationprogress (e:Event):void { if(tma[tma.length-1].currentProgress == 1){ //This doesnt work properly even with totalProgress trace("STEP ANIMATION ENDS HERE"); removeEventListener(Event.ENTER_FRAME, checkStepAnimationprogress); activateDice(); } } Obviously there is some mistake in my logics and I hope someone here will help. TIA, Lasercode
  18. So, I'm creating an Image Gallery. Clicking on buttons calls the "change_section" function, passing it the hires image id. I want to fade out the current image, load the new image, than fade it on the screen. But, for some reason when it losing track of the "this.hires" array that contains the image url, width, height and id. I think it's calling an undefined "Gallery" javascript object. Any insight would be appreciated. Gallery.prototype.change_section = function(_id) { this.new_section = _id; //// Started with TweenMax.to(this, .5, {hires_alpha:0, overwrite:2, onUpdate:reDrawMain, onComplete:this.check_hires}); ///I've tried this var obj = this; TweenMax.to(obj, .5, {hires_alpha:0, overwrite:2, onUpdate:reDrawMain, onComplete:obj.check_hires}); /// Calling just this works, and still sees the "this.hires" array in the Gallery object. So, I don't think it's my logic, but rather I'm not referencing the right javascript object with the onComplete call. this.check_hires(); }; Gallery.prototype.check_hires = function() { var i; for (i=0;i<this.hires.length;i++) { if(this.hires[i].id == this.new_section) { if(!this.hires[i].loaded && !this.hires[i].loading) { this.load_hires(); } else { this.active_section = this.new_section; this.open_hires(); } } } }; The code below is for reference. Maybe I have conflicting calls to TweenMax or something. Gallery.prototype.open_hires = function() { TweenLite.to(this, .5, {delay:.5, hires_alpha:1, overwrite:2, onUpdate:reDrawMain}); }; Gallery.prototype.load_hires = function() { trace("Gallery load_img") var obj = this; var i; var s; for (i=0;i<this.hires.length;i++) { if(this.hires[i].id == this.new_section) { var hires_img = new Image(); this.hires[i].obj = hires_img; hires_img.id = this.hires[i].id; hires_img.onload = function () { obj.hires_loaded(this.id); } this.hires[i].loading = true; hires_img.src = this.hires[i].img; } } }; Gallery.prototype.hires_loaded = function(_id) { var i; for (i=0;i<this.hires.length;i++) { if(this.hires[i].id == _id) { this.hires[i].loaded = true; this.active_section = _id; this.open_hires(); } } };
  19. I'm propably missing something stupid >_< . My code is very simple: mainTimeline = new TimelineMax( { onComplete: test() } ); mainTimeline.append(TweenMax.from(header,2,{x:-header.width})); Why on earth "test()" function would fire instantly without waiting for tween to end? What am I missing? Regards. Luken
  20. Just a quick question, can an onComplete method runs two functions? Like... TweenMax.to(element, 1, {css:{width:"100%"}, onComplete:[function1 function2]}) The above is just an example
  21. I have some code that scrolls a movieClip. The problem is I cannot get the onComplete to fire and remove the listener. It will fire when the clip reaches its bounds but not any time in between. Does my code prevent the tween from completing? import com.greensock.*; import flash.display.MovieClip; var mc:Sprite = new Sprite(); mc.graphics.beginGradientFill(GradientType.LINEAR, [0x666666,0xfff000],[0.9,0.1],[0,255], new Matrix(0,-1,1,0,height,0)); mc.graphics.drawRect(225, 50, 100, 300) addChild(mc); var destination:Point=new Point(); var dragging:Boolean=false; var speed:Number=20; var offset:Point=new Point(); var topLimit:Number = 0 - ( mc.height - (stage.height-50) ); var bottomLimit:Number = 120; mc.addEventListener(MouseEvent.MOUSE_DOWN,startdrag, false, 0, true); stage.addEventListener(MouseEvent.MOUSE_UP,stopdrag, false, 0, true); function startdrag(e:MouseEvent):void{ offset.y=mc.mouseY*mc.scaleY; dragging=true; mc.addEventListener(Event.ENTER_FRAME,followmouse, false, 0, true); } function stopdrag(e:MouseEvent):void{ dragging=false; } function followmouse(e:Event):void{ if(dragging){ destination.y=mouseY; } TweenLite.to(mc, 2, {y:mc.y-=(mc.y-(destination.y-offset.y))/speed, onComplete:removeEFListener}); if(mc.y > bottomLimit){ mc.removeEventListener(Event.ENTER_FRAME,followmouse); TweenLite.to(mc, .6, {y:bottomLimit}); trace('removedBottom'); } if(mc.y<topLimit){ TweenLite.to(mc, .6, {y:topLimit}); mc.removeEventListener(Event.ENTER_FRAME,followmouse); trace('removedTop'); } } function removeEFListener():void{ mc.removeEventListener(Event.ENTER_FRAME,followmouse); trace('removedEL'); } Note: This code is repurposed. I lost the source for the original code and gladly give credit where its due - so if its yours, thanks and good job.
  22. Howdy! Have a problem and was wondering if there was a quick solution... Is there a way to remove all 'onComplete' events? Here is my scenario: - I create and start tweens on movieClips with onComplete events. TweenLite.to(waveMc, 5, {alpha:0, ease:Sine.easeInOut, delay:2, overwrite:false, onComplete:showNextWave} ); function showNextWave() { trace("Still gets called?"); } - Then user initated cancel (halfway through the animation)... need to remove all movieClips - I'm using teh following to remove the movieClip: while (this.numChildren != 0) { this.removeChildAt(0); } It seems that the onComplete event still gets triggered. Is there a way to make sure the tweens and events also get destroyed?