List Hover Effects Border & Bottom Grow | CSS Before / After | HTML/CSS/SASS Tutorial | #8
This is second part of list hover effect videos it uses base code from my previous video.
Watch first part here: • FadeBullet & SlideIn Hover Effects | CSS B...
In this video I am going to share how to use simple css hover transition on before or after css pseudo classes. Using before and after for list items (li) we are going to create two simple hover animation called "Bottom Grow" and "Border Grow".
I'll show you how to leverage css left, top, bottom, right properties to create useful and pleasing list hover effects and then build on what we have learn to create two additional hover effects.
These effects are subtle and simple and can be used in various location.
You can find the source code for this project below:
https://github.com/thebingecoder/Bott...
Package includes both the png file for design and complete SASS & CSS code. Feel free to use it as you see fit.
!!!! If you liked the video subscribe & hit the like button !!!!