Lea Verou 9/5/2011

Pure CSS3 typing animation with steps()

Read Original

This technical article explains how to create a classic typing animation using the CSS3 `steps()` function. It details the implementation, which requires a monospace font and a solid background, and discusses browser compatibility (Gecko/Webkit). The article also explores an alternative method using width animation and provides a simpler cursor example for clarity.

Pure CSS3 typing animation with steps()

Comments

No comments yet

Be the first to share your thoughts!

Browser Extension

Get instant access to AllDevBlogs from your browser

Top of the Week

2
Designing Design Systems
TkDodo Dominik Dorfmeister 2 votes
4
Introducing RSC Explorer
Dan Abramov 1 votes
6
Fragments Dec 11
Martin Fowler 1 votes
7
Adding Type Hints to my Blog
Daniel Feldroy 1 votes
8
Refactoring English: Month 12
Michael Lynch 1 votes
10