Search the Community
Showing results for tags 'delays'.
Found 5 results
-
hi, Is there a way in GSAP to properly override the delay? I am looking for a valid way when I create a tween with the same object reference in memory, it properly overrides the animation and its properties. However, I would like the animation to have a starting delay, and this starting delay does not seem to be supported when overriding another tween. Therefore, I am looking for a behavior that would properly handle the delay when overriding a tween. here test code you can past in your console: setTimeout( async () => { console.log( '💚' ); const obj = { x:0 }; gsap.to( obj, { x:1, onStart:()=>console.log( '💨tl1', obj.x ), onUpdate:()=>console.log( 'upd-1', obj.x, ), delay:1 }); // how overide this tween with new delay ? gsap.to( obj, { x:2, onStart:()=>console.log( '💨tl2', obj.x ), onUpdate:()=>console.log( 'upd-2', obj.x ), delay:5 }); }, 1000 ); In the console log, I would expect the following result: 💨tl1 0 VM33167:4 upd-1 0.16821 VM33167:5 💨tl2 0.16821 VM33167:5 upd-2 0.476336 VM33167:5 upd-2 0.876304 VM33167:5 upd-2 1.304408 VM33167:5 upd-2 1.507727 VM33167:5 upd-2 1.729329 VM33167:5 upd-2 1.83238 VM33167:5 upd-2 1.921491 VM33167:5 upd-2 1.959754 VM33167:5 upd-2 1.987915 VM33167:5 upd-2 1.996086 VM33167:5 upd-2 1.999553 VM33167:5 upd-2 1.999989 VM33167:5 upd-2 2 instead i get this 💨tl1 0 VM33244:4 upd-1 0.039404 VM33244:4 upd-1 0.283607 VM33244:4 upd-1 0.53675 VM33244:4 upd-1 0.675071 VM33244:4 upd-1 0.810253 VM33244:4 upd-1 0.882882 VM33244:4 upd-1 0.942352 VM33244:4 upd-1 0.968883 VM33244:4 upd-1 0.988843 VM33244:4 upd-1 0.995772 VM33244:4 upd-1 0.999423 VM33244:4 upd-1 0.999948 VM33244:4 upd-1 1 VM33244:5 💨tl2 1 VM33244:5 upd-2 1.039404 VM33244:5 upd-2 1.283607 VM33244:5 upd-2 1.547878 VM33244:5 upd-2 1.675071 VM33244:5 upd-2 1.821494 VM33244:5 upd-2 1.882882 VM33244:5 upd-2 1.942352 VM33244:5 upd-2 1.968883 VM33244:5 upd-2 1.989514 VM33244:5 upd-2 1.995772 VM33244:5 upd-2 1.999423 VM33244:5 upd-2 1.999948 VM33244:5 upd-2 2 thanks
-
I'm trying to understand what the negative delay is doing for the Y based tween in this snowfall codepen. I am currently experiencing an issue that does not make any sense where my implementation, being setup almost identically to this codepen, does this weird thing where using a negative delay causes the looped Y based tween of some of the elements (not all) to start abruptly "on screen" even though it was originally set (using gsap.set) to start somewhere off screen. Removing the delay parameter of the tween unfortunately causes all of the elements to drop down at the same time but they all correctly start off screen. The negative delay is the only thing that helps the animation start with a full screen of snowflakes. I read in a separate post that: "A negative repeat delay will restart it before it finishes." If true, then why does it not happen in the codepen linked where the snowflakes fall perfectly from the top to the bottom of the screen? In my tests some start above the screen but others show up abruptly on screen. This has been driving me crazy 😮💨, appreciate any help anyone could provide. -
I'm trying to achieve the following text hover effect: How do I achieve a hover animation that looks like the one in the video? How do I achieve that kind of space/delay between every single letter? Do I have to split them first or is there an easier approach? In the following codepen you can find my current progress.
-
Hey! So I have a timeline loop that should loop infinitely, each new timeline has a negative offset to keep the loop from having a gap at the beginning of each timeline I can achieve the desired effect by adding the same timeline with negative delay multiple times ( lots of timeline.add(anim(), "-=3") ) But for some reason today I can't wrap my brain around how to do this nicely? I have tried various things, negative repeatDelay, onComplete set time() / progress(), but none of them quite work. Something like 2 timelines and the second one loops forever sounds like the right way to do it? Please look at the codepen and all should be made clear, on each 'repeat' of the master timeline there is a gap Thank you in advance ? I'm so sure it's something really simple that I'm overlooking!?!
-
I couldn't find this in the documentation, so I figured I should make a request here! Could TimelineMax be added the same funtionality as TweenMax where you can delay method calls? I realize it couldn't "reverse" the actions caused by those methods (unless a respective reversible callback method was supplied for each delayed callbacks... but nah!), but this would be very handy instead of using dummy [TimelineMax instance].to(...) calls, like the following: var animation:TimelineMax = new TimelineMax(); //Delay the next object's to be added to the displaylist later: animation.to( dummy, 1.5, {onComplete: addChild, onCompleteParams: [someSprite]} ); //INSTEAD, this would be nice! animation.delayedCall( 1.5, addChild, [someSprite] ); It would be SHORTER, sweeter, and ~loved~ by many I'm sure (me first!) Is there any internal complications that prevents this from being implemented?
