Animated Hover Card with Sass

Save
2 years ago
29
animated card hover effect sass hover effect sass animation cards card hover effect amazing card hover effect hovering effects hover effect card hovering effect responsive layout responsive product card sass

Discover the power of Sass and its capabilities in creating dynamic and visually appealing elements. Elevate user experience with interactive hover effects that will leave a lasting impression on your visitors. 💫

Codepen 💻: https://codepen.io/Oskar_Olortegui/pen/yLXgdRM
Watch the most recent videos
https://www.youtube.com/@AlephNeoDev/videos 👀

Hover card with Sass and a little of JS.
this as other of my videos are meant for practicing porpuses.
I hope you find them useful in anyway!
We will see how to animate a card using Sass and JS.
This is NeoDev 👽 - Let's grow together!

🕛🕛TimeStamps🕛🕛
✅ 0:32 initial HTML structure
✅ 3:11 initial SCSS
✅ 4:00 Mixins and Variables in SCSS
✅ 6:59 Nesting SCSS
✅ 11:27 Apply ellipsis Text ⭐
✅ 14:07 JavaScript
✅ 18:06 JavaScript - getBoundingClientRect() Method. ⭐
✅ 19:15 Using restParams - Function argument⭐
✅ 21:17 transform-origin property ⭐
✅ 28:20 adding the Hover class
✅ 30:30 Transition mixin
✅ 34:03 NO Delay Transition mixin

Who am I? 🔍
I am just a new developer trying to learn and grow and I would like you to join
me in this journey
GitHub 😸 https://github.com/AlephOlortegui?tab=repositories
Codepen 💻 https://codepen.io/Oskar_Olortegui

#SassCard #HoverCards #JSevents

Loading comments...