Jump to content
Search Community

How do I Snap to labels?

DeltaFrog test
Moderator Tag

Go to solution Solved by DeltaFrog,

Recommended Posts

Hi yall, 

 

How do I get my timeline to snap to labels or specific times? 

 
My current setup snaps to 0.33, 0.66 and 0.99.    I'd like it to go to the labels below.    

    snap: {
      snapTo: 0.33,
      duration: 0.01,
      ease: "none"
    },

 

Here are the labels/times I want to target.  

tl.addLabel("chart1", 0.20);

tl.addLabel("chart2", 0.40);

tl.addLabel("chart3", 0.60);

tl.addLabel("chart4", 0.80);

 

I tried this but getting an error.    What am I doing wrong here?  

snap: {
      snapTo: 0.20, 0.40, 0.60, 0.80,
      duration: 0.01,
      ease: "none"
    },

 

Link to comment
Share on other sites

You also use "labels" or "labelsDirectional"

 

 snap: {
      snapTo: "labelsDirectional",
      duration: 0.01,
      ease: "none"
    },

 

Quote
  • "labels" - snap: "labels" snaps to the closest label in the timeline (animation must be a timeline with labels, of course)
  • "labelsDirectional" - snap: "labelsDirectional" snaps to the closest label in the timeline that's in the direction of the most recent scroll. So if you scroll a little bit toward the next label (and stop), even if the current scroll position is technically closest to the current/last label, it'll snap to the next one in that direction instead. This can make it feel more intuitive for users.

 

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