WebDev For You - Daily Interaction #135

Welcome to Daily Interaction #135. This demo showcases a project card animation on hover. With this effect the title and caption move on hover. A "View Project" appears and moves down with an underline animation. There is also a cover overlay that moves and appears from the upper-left on hover. This effect was achieved by creating a card wrapper and placing the color overlay inside of it with a position of absolute and full. Then a text wrapper was added to the card wrapper in the center with a heading, text block, and view project text block. The 'view project' text and underline were added inside of another wrapper. Then with interactions I had the different elements move and the underline scale. Inspired by: https://www.everess.fr/ There will be no daily interactions for a while as I am currently working on a few other projects. Stay tuned for the new projects! To view more daily interactions and premium content visit: https://www.webdevforyou.com/