Jump to content
Search Community

Retromonguer

Members
  • Posts

    4
  • Joined

  • Last visited

Contact Methods

Retromonguer's Achievements

1

Reputation

  1. That was it Carl! Many thanks!! I ended up creating my own functions like this self-managing their own timelines and creating them on the fly. It worked perfectly and run smoothly. var animationOut = (function(){ var tl = new TimelineMax({repeat: -1, yoyo: true}); var animationOutObj = { start : start, stop : stop } return animationOutObj; function start(){ if(tl.getChildren().length <= 0){ tl.fromTo(ball2, 1, {scale: 0},{scale: 1, ease: Sine.easeInOut}); tl.play(); } } function stop(){ tl.stop(); tl.clear(); } })(); Thanks again for your help! :)
  2. Hi Carl, back again, Sorry I think I was just playing with it at the moment you saw the code. But luckily I found the issue! The problem was when going to a point in the timeline the value of a property gets the one on which ended the previous tween. In my case I had a Y:-400 in the previous tween so then when getting to the next label the animation was starting there instead of starting from the point in the Y axis on which the object was.At the end as you can see here I setted the Y manually before starting the animation. tlBall2. from(ball2,.6,{y:0, scale:0, ease: Back.easeOut.config(1.5)}). addLabel('loop'). to(ball2,.7,{y:10, ease: Sine.easeInOut}). to(ball2,.7,{y:0, ease: Sine.easeInOut}). call(goToPoint, [tlBall2, 'loop']). addLabel('animationOut', "+=0.01"). to(ball2, 1,{y:-400, ease: Back.easeIn.config(1)}). call(goToPoint, [tlBall2, 0]). addLabel('animationReverse', "+=0.01"). set(ball2, {y:0}). fromTo(ball2, 1,{scale:1}, { scale:0, ease: Back.easeOut.config(1)}). addPause(); Knowing this I have another doubt, is there a way to change the animation of an object starting from the state on which it is in a specific moment regardless of which state is that? I can think of a way using several timelines and swapping between them, or maybe calling a function to retrieve the state of the object and setting it before continuing with the animation, but I am sure there must be a better and cleaner way. Thanks again!
  3. Hi Carl, Thanks a lot for your response! I understand the codepen was a bit too long, sorry! I have managed to make it half the size New Codepen: http://codepen.io/FabioG/pen/0653705a07a243530895856d7306fcef?editors=0010 To try to clarify a bit what I am trying to achieve is a staged animation. When the stage changes the animation will move to some other point in the time line. On top of this I need some animations to keep looping that is why I am using 'call()' to use this function function goToPoint(timeline, point){ timeline.seek(point); } to keep looping inside the animations I need to. I have tried what you said and it worked only for the first seek. It goes perfectly to label tlBall2.seek('animationOut'); but, when trying to get to the last label tlBall2.seek('animationReverse'); It looks like it gets there but the animation is not done. Cheers!
  4. Helo guys, I need some help with a little issue that is driving me crazy. In the codepen I have attached I am trying to animate three balls each one with it's own timeline and I have an animation handler that depending on the stage on which the app is it will move the animation point to one point or another of the timelines using labels. The animation when moving from the loop and seeking the 'animationOut' point should move to the top and out but keeps looping inside the 'loop' label step. The seek function (lines 75, 80, 85, 91, 96) seems to not be working correctly. I am using version 1.19, if using version 1.10 it works for the label called 'animationOut' but not for 'animationReverse'. Can you guys help me out please? Cheers!
×
×
  • Create New...