Jump to content
Search Community

Jump To Labels

Robert May test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi all. Is there a tutorial on how to use labels so that I can test my animations without having to wait for the whole animation to get to the part I'm testing?  I think I remember Carl talking about it in one of his videos but I cannot find it. Thanks!

Link to comment
Share on other sites

Hi @Robert May :)

 

Welcome to the forum and thank you for joining Club GreenSock. 

 

When I'm testing I like to add a 'start test' and 'end test' label. I also add a couple buttons so I can play that test area forwards or backwards via tweenFromTo().

 

See the Pen EKZjpo by PointC (@PointC) on CodePen

Here's some more info about tweenFromTo()

https://greensock.com/docs/#/HTML5/GSAP/TimelineMax/tweenFromTo/

 

Hopefully that helps.

 

Happy tweening and welcome aboard.

:)

  • Like 1
Link to comment
Share on other sites

Thanks for your response, I've been playing with the code pen for a while. When I added ".add(pause)" to your code pen it would no longer tween from start to end or end to start, should that be a problem and if so, is there another way to pause the timeline without interfering with tweening the timeline? 

Link to comment
Share on other sites

4 hours ago, Robert May said:

Thanks for your response, I've been playing with the code pen for a while. When I added ".add(pause)" to your code pen it would no longer tween from start to end or end to start, should that be a problem and if so, is there another way to pause the timeline without interfering with tweening the timeline? 

Hi,

 

You can easily pause a timeline by using .addPause()

https://greensock.com/docs/#/HTML5/GSAP/TimelineMax/addPause/

 

To jump to next label, use:

var nextLabel = getLabelAfter()
tl.tweenTo(nextLabel)
 
 

See the Pen aWExEE by vikrant-icd (@vikrant-icd) on CodePen

 
 

 

  • Like 3
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...