Jump to content
Search Community

Splittext with multiple timeline and different animations for same char

VSBL test
Moderator Tag

Recommended Posts

Hello everyone,

May I ask for help. I have this splitText animation, but would love to have X and OPACITY animation to be with different duration. e.g OPACITY to be 1.5s but X to be 1s. 

 

 

E.G. like with transitions 

See the Pen QWNEowJ by styuit (@styuit) on CodePen

 

Is there is any way to achieve multiple animations for same char?

 

Thank you!

See the Pen poybGqQ by styuit (@styuit) on CodePen

Link to comment
Share on other sites

Hi @VSBL :)

 

Welcome to the forum and thanks for joining Club GreenSock.

 

You can use separate tweens for the two properties and then use the position parameter to start them at the same time. 

 

  tl.from(mySplit.chars, {
    x: 45,
    duration: 1,
    stagger: 0.05
  });
  tl.from(mySplit.chars, {
    opacity: 0,
    duration: 1.5,
    stagger: 0.05
  }, 0);

Is that what you meant?

 

Happy tweening.

 

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