WebDev%20For%20You%20-%20Daily%20Interaction%20%23108 - by WebDev%20For%20You
Created on Wed Apr 17 2019 23:47:45 GMT+0000 (Coordinated Universal Time)
This responsive website has 434 views, 0 comments, and 3 likes.
Welcome%20to%20Daily%20Interaction%20%23108%21%0A%0AThis%20demo%20showcases%20a%20profile%20card%20with%20angled%20blocks%20that%20come%20in%20from%20the%20bottom.%20With%20this%20interaction%20I%20was%20experimenting%20with%20the%20%27elastic%20out%27%20easing%20to%20make%20the%20animation%20a%20bit%20more%20playful.%20A%20name%20along%20with%20the%20blocks%20also%20appears%20in%20the%20upper-right%20with%20the%20same%20easing.%20This%20effect%20was%20accomplished%20by%20setting%20the%20link%20block%20wrapper%20to%20an%20overflow%20of%20hidden%20and%20adding%203%20blocks%20within%20this%20wrapper%20with%20a%20position%20of%20absolute%20and%20full.%20I%20then%20angled%20and%20moved%20each%20block%20using%20transforms%20to%20get%20the%20final%20state%20for%20the%20animation.%20Then%20in%20the%20interaction%20I%20applied%20the%20same%20transforms%20and%20I%20had%20the%20blocks%20move%20in%20and%20out%20of%20the%20link%20block%20wrapper.%20The%20last%20block%20behind%20the%20other%20one%20has%20a%20delay%20as%20well.%0A%0AInspired%20by%3A%20https%3A//littlesnippets.net/snip1375%0A%0Ahttps%3A//www.webdevforyou.com/%0A%0AIf%20you%27d%20like%20more%20information%20on%20how%20this%20interaction%20was%20accomplished%20be%20sure%20to%20join%20the%20Slack%20Community%21
Visit http://webdev-for-you-daily-interaction-108.webflow.io
