Jump to content
Search Community

Add a pause or delay in an existing tween

monospace test
Moderator Tag

Go to solution Solved by OSUblake,

Recommended Posts

What's the most efficient way to add a pause/delay of arbitrary length at an arbitrary position in an existing tween or timeline?
I'm looking for something like addPause()but with a duration parameter as well as a position parameter.

See CodePen for what I'm trying to achieve.

Thanks for your time.

 

See the Pen jOwKBBy by monospace (@monospace) on CodePen

Link to comment
Share on other sites

  • Solution

Hi monospace!

 

.addPause() will only work with a timeline, but you could do something like this using delayedCall.

 

let tl = gsap.timeline()
  .to(".blob", {
    y: 200,
    duration: 9,
    ease: "none"
  })
  .addPause(3, function(){  
    gsap.delayedCall(2, () => tl.resume());
  })
  .addPause(6, function(){
    gsap.delayedCall(2, () => tl.resume())
  })

 

  • Like 6
Link to comment
Share on other sites

There are a bunch of helper functions at https://greensock.com/docs/v3/HelperFunctions, yes, but I don't really think this one warrants a place on that page because:

  1. I doubt many people would use it. That page can be overwhelming already, so we have to be careful not to add too many.
  2. It's pretty simple/basic. I'd guess that most people could do that on their own (but I could be totally wrong). 
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...