Marketplace
Made in Webflow

WebDev For You - Daily Interaction #110

2101 views
site profile thumbnail

Description

Welcome to daily interaction #110. This demo showcases a social media card animation on click. For this demo I have 3 social media cards appear below the profile card on click. This effect was achieved by resizing the social media blocks from 0 to it's original size which causes the up and down motion of the profile card at the top. I also used scale, move, and opacity transformations in interactions to change the 'contact me' button from text to an arrow. Another 'contact me' text also appears in the lower left hand corner of the card when clicking. Inspired by: https://codepen.io/BeanBaag/pen/dzyGpM https://www.webdevforyou.com/ If you'd like more information on how this interaction was accomplished be sure to join the Slack Community!
Feeling inspired?If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.
webdevforyoudailyinteractioninteractionssocialmediacardscontactonclickclick

More by WebDev For You

See profile
View details
WebDev For You - Daily Interaction #8
205
978