DEV Community

Discussion on: Animations without JS...or CSS...or IMAGES??!? 😲 Pure HTML animation!

Collapse
 
grahamthedev profile image
GrahamTheDev • Edited

I automated it - you can split a gif easily online into frames. Then I just used canvas to turn the frame grey and apply letters depending on the lightness / darkness of a square.

The only manual part was copying the text into a page as I couldn’t think of a way to automate that quicker than just copy and pasting.

Collapse
 
12944qwerty profile image
12944qwerty

Did you apply each letter by hand? Or did you make a program to detect that...

Thread Thread
 
grahamthedev profile image
GrahamTheDev

Oh god know - the program had 8 characters to choose from that represented different darknesses for pixels. So a # is darker than a ( for example. It then just spit out a 200 by 60 string that I could copy and paste into a <pre> tag so it was evenly spaced