Type/Text Reveal on page load

Design help General
1

Anyone know how to do this interaction as the page loads? I thought I could do it by wrapping the text with spans, but it doesn’t seem like you can animate spans.

Here is what I’m trying to do: https://alexleiphart.com/

Thanks!

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

This is done with some custom javascript, but I found a nearly identical example here from this Stack Overflow thread. It should work out for you, just make sure you modify the section on line four to match the class you use in your project.

$('.your-class-name').each(function(){
3

Thanks so much! This really helps.

4

In addition to what @mikeyevin said, you may want to look into GSAP - SplitText Text Animation - Products - GreenSock

Really cool tool for text manipulation - a bit of a learning curve though.

1 Like