141 CSS Menu
Collection of free HTML and CSS navigation menu code examples. Update of June 2018 collection. 27 new items.
Table of Contents
Related Articles
- CSS Accordion Menus
- CSS Circle Menus
- CSS Dropdown Menus
- CSS Mobile Menus
- CSS Sidebar Menus
- CSS Horizontal Menus
- CSS Fullscreen Menus
- CSS Sliding Menus
- CSS Toggle Menus
- CSS Off-Canvas Menus
Links
Made with
- HTML (Pug) / CSS (SCSS)
About the code
Off-Canvas Menu
Pure CSS off-canvas menu.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML (Slim) / CSS (SCSS) / JS
About the code
Moving Underline Nav Menu
Compatible browsers: Chrome, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
CSS Folding Menu
A simple yet beautiful folding menu made in CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Fun Hover Navigation
Fun navigation effect using CSS keyframes. A quick jump back to the old school.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Pure CSS Magic Line Navbar
It's pure CSS. All links need to have a consistent dimensions for this to work. You have to set everything up yourself in terms of telling the nav how many items there are and where the .line should move to whenever one of the links gets hovered.
Compatible browsers: Chrome, Edge (partial), Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS / JS
About the code
Interactive Radial Menu
Interactive radial menu in HTML, CSS and JS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: font-awesome.css
Links
Made with
- HTML (Pug) / CSS (SCSS) / JS
About the code
Creative Hamburger Menu
Hamburger menu using the new clip-path CSS property.
Compatible browsers: Chrome, Edge (partial), Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Circle Menu
nice pure CSS circle menu.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: font-awesome.css
Links
Made with
- HTML / CSS (SCSS)
About the code
Position Sticky Subnav
Sticky subnavigation in pure CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML (Pug) / CSS (SCSS) / JS
About the code
Nice Effect For Navigation
Excellent hover and click effect for navigation bar or other.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Drop Down Menu
CSS only drop down menu.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS)
About the code
Navigation Menu
Usable as navigation, menu or effect. It uses CSS transform and perspective to create a unique hololens-like animation effect.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Made with
- HTML / CSS / JS
About the code
Jelly Menu
Jelly menu concept in HTML, CSS and JS.
Compatible browsers: Chrome, Edge (partial), Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (SCSS) / JS
About the code
Navigation Buttons
UI navigation buttons.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: font-awesome.css
Links
Made with
- HTML / CSS
About the code
3D Navbar
3D navbar in HTML and CSS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Made with
- HTML / CSS
About the code
Just Another Menu
Pure CSS floating menu animation.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML / CSS (Stylus)
About the code
Pure CSS Menu
Pure CSS menu drawer with off-click.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
CSS Menu Feat. Emoji
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS) / JS
About the code
Code Menu
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS / JS
About the code
CSS Grid Menu Panels
Animated CSS grid-based menu panels. Click the toggle in the top left corner to see it in action.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
The Menu
Table contents style menu.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS
About the code
Circle Menu
Pure CSS circle menu.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: font-awesome.css
Links
Made with
- HTML (Pug) / CSS (Stylus)
About the code
Perspective Menus
CSS only perspective menus.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Made with
- HTML / CSS
About the code
Menu Effect
Reverse text color menu effects.
Compatible browsers: Chrome, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML / CSS (SCSS) / JS
About the code
Menu
Toggle menu in HTML, CSS and JS.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: no
Dependencies: -
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Dropdown Menu
Custom dropdown menu.
Links
Made with
- HTML / CSS
About the code
Hover Effect for Horizontal Menu
Pure CSS fading out for siblings menu options on option hover.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: -
Links
Made with
- HTML
- CSS/SCSS
- JavaScript/Babel (jquery.js)
About the code
Responsive Sidebar/Navbar
Vertical/Horizontal responsive sidebar/navbar.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript/Babel (classList.js, smoothscroll.js)
About the code
Off-Canvas Navigation w/Page Transitions
More experimentation with transitions and navigation. Decided to add in a little bit for page transitions as well.
Links
Made with
- HTML
- CSS (bootstrap.css, font-awesome.css)
- JavaScript (jquery.js, bootstrap.js)
About the code
Sidebar Template
Sidebar template with drop down menu based on Bootstrap.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Sidebar Indicators
Sidebar menu with indicators.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript/Babel (jQuery.js, TweenMax.js)
About the code
Circle Navigation
Experimental navigation menu for a technical website. Built with GreenSock Animation Platform and SVG.
Links
Made with
- HTML
- CSS
- JavaScript (anime.js)
About the code
Submenu Expand
A playful animation expanding the submenu on the toolbar in web apps. Translates, fades and morphes SVG icons. Inspired by Virgil Panas more submenu transition on dribbble.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Morphing Tab Button With List
Morphing button with a dropdown list beneath it.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript
About the code
Radial/Circular Menu Concept
Experimenting with radial menus. Inspired by the right-click-to-expand radial menus of Rust. Change the number of menu items in the bottom right to see how it works with a different number of menu items.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Dropdown Menu
Nice dropdown menu.
Mega Menu CSS
Menu in CSS & HTML.
Made by theo sije
June 15, 2017
Fancy Toggle Menu
A fancy toggle menu to edit quickly posts on websites.
Made by Florian Guiffrey
June 14, 2017
NavMenu
Expandble/collapsable navigation menu.
Made by Mitchell Swaffield
June 12, 2017
Links
Made with
- HTML
- CSS/Sass (bootstrap.css)
- JavaScript (jquery.js, bootstrap.js)
About the code
Fixed Navigation Sidebar
This is a layout/design playground for a work project. Utilising Bootstrap instead of Flexbox for IE9/10 support. Will use media queiries to serve pull page menu based on bootstrap breakpoints.
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Fullscreen Menu
Fullscreen menu with Flexbox & jQuery.
Links
Made with
- HTML
- CSS/SCSS (bootstrap.client.css, bootstrap.admin.css, font-awesome.css)
- JavaScript
About the code
Admin Sidebar
Admin sidebar HTML and CSS menu.
Links
Made with
- HTML/Haml
- CSS/SCSS
About the code
CSS-Only Nested Dropdown Navigation
CSS only nested dropdown navigation with ARIA.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Dropdown Menu
Dropdown menu with jQuery.
Radial Menu Animation
Mobile radial menu animation with HTML, CSS and JavaScript.
Made by Anton Mudrenok
March 30, 2017
Slide Accordion Menu
Slide accordion menu with HTML, CSS and JavaScript.
Made by Anya Melnyk
January 9, 2017
Ribbon Navigation
SVG Ribbon Navigation. Originally built as a quick prototype for some client work. The code could do with being more dynamic.
Made by Steve Gardner
December 15, 2016
Off-Canvas Menu Animation With Burger Icon
Side menu animation with burger icon with HTML, CSS and jQuery.
Made by Maxime
November 26, 2016
Angled Menu
Angled menu with HTML, CSS and jQuery.
Made by Keith Light
November 25, 2016
Circular Navigation Concept
A new navigation concept with HTML, CSS and JavaScript.
Made by Benedict
November 24, 2016
Menu Shelf
HTML, CSS and JavaScript sliding menu.
Made by Alex Coven
October 29, 2016
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Real Fullscreen Navigation
A full viewport responsive navigation.
Links
Made with
- HTML/Pug
- CSS/SCSS
- JavaScript/Babel
About the code
Style Dropdown Menu
Recently stripe.com Redesign it site, and the primary menu interaction really grab my attention. So here is the simple version of it.
A Clean Navigation Slider
This is a very clean navigation with a cool slider.
Made by Roemerdt
August 20, 2016
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Fullscreen Menu
Simple full screen menu that fades in when menu icon is clicked.
Links
Made with
- HTML
- CSS/Sass
- JavaScript (jquery.js)
About the code
CSS Staggered Animation Dropdown Menu
This is a simple example of applying an animation delay to each child of a basic horizontal dropdown navigation menu.
Animated Mobile Navigation
Animated mobile navigation created in Javascript using Greensock.
Made by Greg Hovanesyan
July 11, 2016
Simple jQuery Slide Menu
Very simple jQuery slide menu.
Made by P.S.Blakemore
July 10, 2016
Secret UI Project
Secret UI Project is prototype mockups created by Anton Aheichanka that has been converted into web version.
Made by Mohan Khadka
July 10, 2016
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Floating Circular Menu
Pretty floating circular menu with HTML, CSS and JS.
Velocity.js Fullscreen Flexbox Overlay Navigation
Fullscreen flexbox overlay navigation with velocity.js.
Made by Mirko Zorić
June 20, 2016
Full Page Off-Canvas Navigation
An example of how to build a full page navigation that exists off of the screen canvas, sliding into view when clicking the menu option. Added spice with a changing background color depending on navigation item hover.
Made by Caleb Varoga
June 17, 2016
Simple Radial Menu
HTML, CSS, JavaScript simple radial menu with social icons.
Made by Nikolay Talanov
June 13, 2016
Accordion Menu
Simple accordion menu with HTML, CSS and JavaScript.
Made by JuliaRietveld
June 8, 2016
Mobile Filter Menu
Filter menu created by Anton Aheichanka that has been converted into web version.
Made by Arjun Amgain
June 1, 2016
Links
Made with
- HTML/Slim
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Fullscreen Menu Flexbox Style
Chrome and Firefox good... IE bad, no transition support for flex property.
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Dropdown Menu Animation
Nice dropdown menu with animation.
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Mobile Navigation Animation
Mobile navigation open and close animations using GSAP TweenMax and TimelineMax. Still needs some transition tweaking...
Links
Made with
- HTML
- CSS
- JavaScript
About the code
SVG UI Navigation Concept
Just SVG & CSS3 animations, without any animation libraries.
Links
Made with
- HTML/Pug
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Dropdown Menu
Dropdown menu with little jQuery.
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Dropdown
Pretty dropdown menu.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
SVG Gooey Hover Menu Concept
Uses SVG path manipulation based on mouse position to 'chase' the user's position.
Links
Made with
- HTML
- CSS/SCSS (font-awesome.css)
- JavaScript (jquery.js)
About the code
Sidebar Navigation
Sidebar navigation with tooltips.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Fullscreen Navigation
Includes a burger with pure CSS animations, fadeIn animations from animate.css, minimal JS.
Header Navigation Menu
Header navigation menu with HTML, CSS and jQuery.
Made by Kyle Lavery
February 4, 2016
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Menu Fullscreen
Menu fullscreen CSS.
Fullscreen Flexbox Overlay Navigation
Fullscreen flexbox overlay navigation in HTML, CSS and jQuery.
Made by Mirko Zorić
January 8, 2016
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Details Info & Navigation
Navigation with jQuery, CSS and HTML.
CSS3 + jQuery Fullscreen Menu
Simple, basic and elegant CSS3 and jQuery driven fullscreen menu.
Made by Anton Petrov
December 5, 2015
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jQuery.js)
About the code
Full Screen Navigation Overlay
An example of a full screen navigation overlay utilizing flexbox.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Circular Material Menu
Unusual circular menu.
Semicircular Gooey Menu
Gooey menu with CSS and SVG filters. Version 1.
Made by Lucas Bebber
October 22, 2015
Sliding Navigation Menu
Sliding navigation menu is hidden by default.
Made by Aleh Isakau
October 4, 2015
4 Fullscreen Navigation
4 Fullscreen navigation with HTML, CSS and jQuery.
Made by ari
September 13, 2015
Fullscreen Navigation
CSS hamburger animation taken fromhttp://codepen.io/designcouch/details/Atyop/
Made by Marcus Bizal
September 3, 2015
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Frosty Nav Toggle Effect
HTML, CSS and jQuery frosty navigation toggle effect.
Hamburger Icon With Morphing Menu
Creative menu made with HTML, SASS/CSS3 and JQuery.
Made by Sergio
July 15, 2015
Dropdown Navigation
Dropdown navigation with HTML, CSS and JavaScript
Made by Ryan Morr
July 7, 2015
Full Screen Navigation Using SVG
Full screen navigation using SVG, HTML, CSS and jQuery.
Made by Anas Ashraf
July 2, 2015
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Gooey Mobile Navigation
The cool gooey effect applied to a mobilestyle menu. jQuery and CSS transitions for the animations.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Fullscreen Navigation
Fullscreen navigation with HTML, CSS and JS.
Colourful Navigation
When you hover the colourful navigation the dot follows your moves to the current item. When you leave it goes back to the active item.
Made by Lewi Hussey
June 4, 2015
Simple JS Mobile Navigation
Simple JS mobile navigation with HTML and CSS.
Made by Kieran Hunter
May 26, 2015
Links
Made with
- HTML
- CSS/SCSS
- JavaScript/Babel (jquery.js)
About the code
Fullscreen Menu
Simple fullscreen menu.
Explosive Menu
A, rather explosive, menu is just a click away. All you have to do is say fire.
Made by Harris Carney
May 17, 2015
Links
Made with
- HTML/Haml
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Off Canvas Nav
Sass off-canvas navigation.
Solution For Long Drop Down Items
Problem with long drop down menus? Well, try this simple solution with the use of JavaScript and jQuery.
Made by Larry Geams Parangan
March 13, 2015
Full-Screen Menu Overlay
A full-screen menu, showcasing your brand and website navigation. Built using SCSS and vanilla JS.
Made by Ettrics
March 12, 2015
Links
Made with
- HTML
- CSS
About the code
CSS Dropdown Menu
Full CSS dropdown navigation. Drops down on click by the use of a hidden checkbox.
Fullscreen Menu
HTML, CSS and jQuery fullscreen menu.
Made by Paul van Oijen
March 6, 2015
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Mobile Menu
HTML, CSS and jQuery effect for mobile menu.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Accessible Fullscreen Overlay Menu
A fairly accessible fullscreen overlay menu built with jQuery and CSS.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Quick And Easy Fullscreen Menu
Crafted and debugged in 5 minutes, IE10+ compatible. Might not be ideal for production but would help you if you need a quick working responsive and modern menu.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Full Page Off-Canvas Navigation
An example of how to build a full page navigation that exists off of the screen canvas, sliding into view when clicking the menu option. Added spice with a changing background color depending on navigation item hover.
Offcanvas Sidebar Menu With A Twist
HTML, CSS and jQuery offcanvas sidebar menu with a twist.
Made by Devilish Alchemist
January 13, 2015
Off Canvas Menu
Little off canvas animated menu.
Made by Mark Murray
November 28, 2014
Accordion Drop Down Menu
HTML, CSS accordion menu with jQuery. No plugins.
Made by Agustin Ortiz
November 18, 2014
Flat Vertical Navigation
A simple flat vertical navigation with multi animated drop down menu. Also including Font Awesome and Animate.css.
Made by Andy Tran
November 18, 2014
Links
Made with
- HTML/Pug
- CSS/SCSS
About the code
A Simple Dropdown Menu
Just a simple HTML and CSS dropdown menu.
Material Design Navigation
The page slides to reveal a clean, simple navigation.
Made by Lewi Hussey
October 30, 2014
Triangular Mobile Toggle Navigation
Triangular mobile toggle navigation with HTML and CSS.
Made by MoKev
October 12, 2014
CSS3 Funny Side Menu
A funny CSS3 menu.
Made by Wagner Moschini
September 1, 2014
Links
Made with
- HTML/Haml
- CSS/Less
- JavaScript (jquery.js)
About the code
Flat Horizontal Navigation
A flat horizontal navigation that uses jQuery for a clean dropdown menu alongside with animate.css for the nice flip at the beginning.
Flat Vertical Navigation
A simple flat vertical navigation with a simple dropdown menu.
Made by Andy Tran
September 1, 2014
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Fullscreen Menu
Fullscreen hamburger menu.
Links
Made with
- HTML
- CSS
- JavaScript (bounce.js,
snap.svg)
About the code
Off-Canvas Menu Effects
Some inspiration for off-canvas menu effects and styles using CSS transitions and SVG path animations.
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Radial Menu
Animated radial menu.
Toggle Menu
Toggle menu with HTML, CSS and jQuery.
Made by Yoann
July 16, 2014
Links
Made with
- HTML
- CSS
About the code
Pure CSS Transition Effects For Off-Canvas Views
You have probably all seen the "drawer menu/off-canvas" navigation style made popular by Facebook a few years back. There are a lot of great javascript plugins that offers this functionality, but I thought it would be cool to try and do this with the new cool features of css. No javascript required. - Thomas Wilthil
Links
Made with
- HTML
- CSS/SCSS
- JavaScript (jquery.js)
About the code
CSS Off Canvas Menu
Another off canvas menu using the checkbox hack to active mobile navigation.
Side Accordion Menu
HTML, CSS, jQuery sidebar accordion menu.
Made by Benjamin
April 18, 2014
Fixed Flyout/Off-Canvas Navigation
A responsive fixed menu that’s always right there.
Made by Colin
April 3, 2014
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Dropdown Menu
The hover menu is pure CSS. The toggle menu utilizes a minimal amount of JavaScript, but will degrade gracefully because it only uses JavaScript to close the menu when the user clicks outside of the menu.
Full circular animated navigation in CSS. Perfect for mobile. Based on codrops’s circular navigation.
Links
Made with
About the code
Circular Navigation Popout
Animated Menu
A simple fullscreen menu.
Made by Una Kravets
January 31, 2014
Links
Made with
- HTML
- CSS
About the code
Dropdown Menu UI
Pure CSS dropdown menu.
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Touch Device Jelly Menu Concept
Touch device jelly menu concept with HTML, CSS and JavaScript.
Vertical Accordion Menu Using jQuery And CSS3
A sleek vertical accordion menu for your next website/app. The headings use Font Awesome icon font. CSS3 gradients, transitions, and shadows have been used in the demo along with minimalistic use of jQuery for sliding the link lists.
Made by thecodeplayer
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Circular Links Menu
Responsive circular links menu.
Links
Made with
- HTML / CSS (SCSS)
About the code
Horizontal Menu
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Responsive: yes
Dependencies: font-awesome.css
Links
Made with
- HTML
- CSS
- JavaScript
About the code
Bounce Mobile Menu
Menu animation with HTML, CSS and jQuery.
Links
Made with
- HTML
- CSS
- JavaScript (classie.js)
About the code
Circular Navigation With CSS
A tutorial on how to create a circular navigation using CSS transforms.
Links
Made with
- HTML/Haml
- CSS/SCSS
- JavaScript (jquery.js)
About the code
Flexbox Off Canvas Menu
Lightweight, simple, easy to use.
Links
Made with
- HTML
- CSS/LESS
- JavaScript (jquery.js)
About the code
Dropdown Menu
This is a simple dropdown menu made using unsorted lists and CSS3 transitions.
Links
Made with
- HTML
- CSS
About the code
Off Canvas Menu with Animated Links
A simple off canvas mobile navigation with delayed link animation. The links have a simple transition effect of fading in from right to left when the navigation is toggled. But the animation occurs in a chained way where the links animate one after the other. This is done by adding a transition-delay to every link.
Mega Menu
About the code
Mega Dropdown
A responsive and easy to customise mega-dropdown component.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Responsive Mega Menu
Responsive mega menu for mobile view.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Responsive Mega Menu
Responsive mega menu with flexbox.
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Sexy Flexy Mega Menu
I saw a gif of this style menu on Scout's page on Dribbble and decided to take a shot at it, I thought it was pretty cool to add some subtle animation to the active menu and I also wanted to use flexbox a bit to help lay this out. - Mike Torosian
Links
Made with
- HTML
- CSS
- JavaScript (jquery.js)
About the code
Responsive Mega Menu
Responsive mega menu with blog, images and drop down.
Links
Made with
- HTML
- CSS/SCSS (foundation.css)
- JavaScript (jquery.js, foundation.js)
About the code
Mega Menu Dropdowns with Foundation 5
A mega menu (a big, 2-dimensional drop-down panel) groups navigation options to eliminate scrolling and use typography, icons, and tooltips to explain users’ choices.