Ripple Effect Button with CSS and Vanilla Javascript for BEGINNERS

Описание: Hey everyone, I didn't post a tutorial for a while, so I decided to make a tutorial on how to make a ripple effect button with CSS and vanilla Javascript.
I hope you enjoy this tutorial, and if you have any questions, feel free to ask them in the comments. Thanks for watching!

here is the Codepen.io link: https://codepen.io/joroh/pen/WNQYgEX

The ripple effect is a part of the modern design trend, it was introduced first with material design in Android 5.0
there are many ways to make it works, in this tutorial, we are going to use ::before or ::after CSS pseudo-elements.

0:00 Intro
0:24 HTML
0:33 CSS
1:26 JavaScript
2:07 CSS Variables
2:43 Get the current clicked axis with JS
3:13 outro

#css #css_animation #javascript #rippleeffect