DEV Community

Cover image for Make a Cool Typing Effect in just 5 Lines of JS code
πŸ”₯[Video Tutorial]
Neat Coder
Neat Coder

Posted on

Make a Cool Typing Effect in just 5 Lines of JS code πŸ”₯[Video Tutorial]




Hey Guys!!
This is a New Video from My YouTube Channel !
It's about designing a Cool Typing Effect !
I've made a Live Demo for you to try at https://cool-typing-effect-neatcoder.netlify.app

The Main objective of this tutorial is to implement something like this in less javascript code !

The Code is Pretty Simple! It uses the setInterval() function to loop through a string and append each Letter in the String To an Empty element..
Then, the cursor blinking effect is done with CSS. It sets the border-right property of the span element to white color and again sets it to transparent ...
So, I hope you got a Simple idea about this!

Get the Source files at https://github.com/Sakindu-d/Cool_Typing_Effect

Support My YT Channel at https://www.youtube.com/channel/UC_x91mqbyHX4-meYOpMxyUA

Thank you! πŸ˜„πŸ˜„πŸ˜„

Top comments (2)

Collapse
Β 
thomasbnt profile image
Thomas Bnt β€’

Hello πŸ‘‹
Why did you not write here the tutorial and examples? Could be better for your post!

Collapse
Β 
neatcoder profile image
Neat Coder β€’

Hey,
I'll put! Thanks for the Suggestion πŸ˜„πŸ˜„πŸ˜„!