005Word by word

For this effect, I wanted to make the words of a paragraph appear from the right edge of the screen, moving into their final position. I also staggered the start of each word’s movement for a more elegant result.

HTML Structure

To keep the effect easy to implement, you can write a text inside an element without worrying about wrapping each word in a span. This element will be the child of a division that we’ll later pin to the user’s scroll.

<div class="pin">                    
    <div class="container">
        <p class="paragraph">Henri Matisse (1869→1954) was a French artist</p>
    </div>
</div>

Become a member to unlock
the full effect
today.

Join now

Discover the platform

See how the platform works: try Effect #000 for free.

Try it now

(No registration or credit card needed)