css3
comment 0

Twitter’s Animated Fav Button

Recently, Twitter has updated their fav button to an animated fav button. The key to producing this effect is by using CSS animation steps timing function. How it works? The general concept of this implementation is similar to zeotrope devices which display a sequence of illustrations showing progressive phases of that motion. In this demo by Donovan Hutchinson, the key frames are placed equally spaced in one line in a single image file, and we control it using transition from the first to the last frame by positioning the background. Hit the button below to learn more.

View More

Filed under: CSS

About the Author

Posted by

Sani Halid is a front-end developer at Stampede and is committed to clean and elegant code. Yet another gamer to join the pack, Sani is also the Editor at Constructs where he shares his daily CSS findings and other front-end development goods.

Leave a Reply