Jump to content
Search Community

Centering dynamic text

Cothien test
Moderator Tag

Go to solution Solved by Carl,

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

Sorry if this is basic or what not, I am a complete newbie. Tried a few things and mutilated the css.


I have a simple timeline where a div with text moves in from the left to the screen. I am trying to center that text so the middle of the text is in the middle of the screen no matter how long the text is. Since the text can be different length, the center of the text can be in different locations.


Tried with some percentages, but that caused some text to be off screen or misaligned.


I didn't know if there was a easy way to do that within the timeline animation or if it would have to be done in JS.

See the Pen BojOwR by anon (@anon) on CodePen

Link to comment
Share on other sites

Hey Diaco,


I had tried to add the xPercent to the tween, but did not get it to center the text. There is probably conflict with the css for the text container div. Broke it few time, but not sure what to do to fix it so the text will center.

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