Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Richdigdesign

Text animation, Split text, Scroll. Newbie question

Recommended Posts

Hi there, 

 

May I ask the Greensock community for their wisdom please. I am trying to recreate something similar to this https://www.basili.co/ just the header animation. I guess it's a mix between a scroll loop and split text. I have tried in vein, any insight would be much appreciated. 

 

Thanks, 

 

Rich

Share this post


Link to post
Share on other sites

@Richdigdesign I'm not even sure you need split text for this. To me it just looks like a series of animated lines, each with a "home" position and (eventually) highlighted text. Something like this,

 

See the Pen oNgQmGd by sgorneau (@sgorneau) on CodePen

 

Of course you'll want to adjust your final "landing" spot for each segment. And you'll want to look at how these lines of text are created from a semantic and accessibility standpoint.

 

Hope this helps!

 

Shaun

 

  • Like 4

Share this post


Link to post
Share on other sites

 

After two beers and some pub maths:

 

See the Pen abzQeOo by mikeK (@mikeK) on CodePen

 

Have fun ...

Mikel

  • Like 4

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×