WebDev For You - Daily Interaction #88

Welcome to daily interaction #88.
This demo showcases a menu trigger animation on click. When you first click the menu trigger, the lines rotate clockwise and then the lines turn into an 'x' indicating that you can then close the menu. On the second click the 'x' stays in its current position and just returns to a 3 line horizontal menu trigger. On second click the menu trigger actually rotates back but it's not noticeable because the duration is set to 0 and the easing is set to linear.
This demo was inspired by these hamburger icon animations here: https://codepen.io/carlosriera/pen/qNgAEo/
To view more daily interactions and premium content visit: https://www.webdevforyou.com/
Similar sites

15
112

14
59

36
313

29
200

13
107

36
285