Cool animation I found
Susan Lau - February 2023I'm sure the talk Susan Lau gave was very interesting and useful. Sadly, the room was quite cramped and Susan did not have a microphone so I could only make out a few words about SQL and databases and stuff like that. So rather than writing my report on Susan Lau's talk here, take a look at this neat way to animate text using svg and css
I found this animation on
Tympanus, along with some other cool ones. This one caught my eye the most though. It
uses the stroke-dasharray
and
stroke-dashoffset
properties to create the animation. The
stroke-dasharray
property specifies the length of the dashes and the
gaps between them. The stroke-dashoffset
property specifies the
distance between the start of the dash and the start of the path. By animating the
stroke-dashoffset
property, we can make it look like the dashes are
moving along the path.