On-Scroll Text Repetition Animation – Codrops

From our sponsor: Try Mailchimp today.

Today I’d like to share a simple, but intriguing looking typography effect with you. This on-scroll animation is a recreation of the effect seen on the fabulous site of Dr. Dabber, where you see fragments of a large text moving as you scroll the page.

As we scroll we move out several layers of the same text at the top and bottom. By setting the same background color as the page, we can create gaps between these layers.

With some style adjustments we can create a variety of looks, text-shadow like ones or outlines, the possibilities are endless!

This is how it looks when you scroll:

I really hope you enjoy this little effect and find it useful!

Source link

Show More


Makes Noise is a blog where you can find all the juicy details on a variety of topics including health and fitness, technology, lifestyle, entertainment, love and relationships, beauty and makeup, sports and so much more. The blog is updated regularly to make sure you have all the latest and greatest information on the topics that matter most to you.

Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button