WebDev%20For%20You%20-%20Daily%20Interaction%20%23109 - by WebDev%20For%20You
Created on Thu Apr 18 2019 22:36:02 GMT+0000 (Coordinated Universal Time)
This responsive website has 513 views, 0 comments, and 7 likes.
Welcome%20to%20Daily%20Interaction%20%23109%20%3A%29.%0A%0AThis%20demo%20showcases%20a%20menu%20item%20animation%20on%20hover.%20When%20you%20hover%20over%20each%20menu%20item%20a%20line%20goes%20through%20the%20text%20at%20the%20top%20and%20another%20line%20reveals%20at%20the%20bottom%20adding%20to%20the%20menu%20item%20name.%20This%20effect%20was%20accomplished%20by%20having%20the%20top%20text%20and%20line%20inside%20of%20a%20wrapper%20with%20an%20overflow%20of%20hidden.%20Then%20the%20line%20was%20moved%20from%20left%20to%20right%20via%20interactions.%20The%20bottom%20text%20and%20block%20are%20inside%20of%20a%20wrapper%20as%20well%2C%20and%20I%20have%20the%20block%20moving%20in%20the%20opposite%20direction%20as%20the%20top%20line.%20One%20thing%20to%20note%20with%20this%20interaction%20is%20that%20the%20bottom%20block%20had%20to%20be%20moved%20immediately%20back%20to%20the%20right%20after%20revealing%20so%20that%20on%20hover%20out%20it%20comes%20in%20from%20left%20to%20right%20which%20is%20the%20opposite%20of%20the%20line%20movement%20for%20the%20top%20text.%0A%0AInspired%20by%3A%20https%3A//tympanus.net/Development/MenuHoverEffects/inola.html%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-109.webflow.io
