Menu Image Animation On Hover
A hover effect for a menu where images appear with an animation on each item.
Made with: HTML,CSS,JS
Svg Navigation
Tinker with SVG syntax, the textPath element and the startOffset attribute to create an intriguing navigation. Animated with anime.js.
Made with: HTML,CSS,JS
Full-Page Nav Stacking Animation
A nav menu concept in which the three bars fill up the screen. This happens in a way that looks like blocks being stacked. When collapsing the menu, the sequence is reversed.
Made with: HTML,CSS,JS
Full-Page Navigation
Created full-page navigation using anime.js and some SVGs.
Made with: HTML,CSS (SCSS),JS
Sticky Scrollspy Navigation
Smooth scrolling sticky scrollspy navigation.
Made with: HTML,CSS,JS
Header Nav Overflow Into Mobile Nav
The idea behind this header nav is to move items that no longer fit into a navigation drawer/mobile nav. The trick behind it is to give the header a set height and allow the header nav items to wrap, but hide the overflow. Then use JavaScript to check for any items that have wrapped and reveal them in the drawer/mobile nav.
Made with: HTML,CSS (SCSS),JS