Animating stroke-dasharray and stroke-dashoffset6:30 with Guil Hernandez
In this video, you will learn how to use the stroke-dasharray and stroke-dashoffset properties to create line animations.
CORRECTION: Creating an Animated Line Drawing
- Add a stroke to the path
stroke-dasharrayequal to the path's total length
stroke-dashoffsetthe same as
var path = document.querySelector('.logo'); var length = path.getTotalLength();
Learn more about this method in this article.
Animated Line Drawing Examples
You need to sign up for Treehouse in order to download course files.Sign up