Category: Menu & Navigation

Open source code has hastened the development process for everyone involved. Larger platforms such as WordPress have completely revolutionized the methods in which we create websites. But also consider the smaller plugins built for animation, form effects, and of course navigation menus.
This gallery includes the ...

Mobile responsive design is one of the greatest achievements in recent web design history. A very popular responsive technique is the hidden drawer sliding navigation menu. This can be found in smartphone applications but has also grown into a popular choice for web development. In this post I've organized ten free ...

It is usually not easy to present "menus that are few levels deep" in a user-friendly way. And, that's specially hard for cross-platform layouts.
Multi-Level Push Menu is a jQuery plugin that provides a very good solution to such menus.
It has support for unlimited levels, works cross browser/platform and ...

In mobile layouts, the space is limited and it should be used wisely to display as much as possible.
That was when "off-canvas navigations (hidden menus which appear when requested)" became popular. And now, they are used on desktop too.
Codrops has recently published an article which describes how such ...

For responsive layouts, we should consider how every web element will behave in different screen sizes.
There are pretty standard solutions for elements and components like images, video, typography, navigation, etc.
However, when it comes to multi-level menus, things can get complicated as it gets difficult to ...

Sticky menus are used widely as they help minimizing the need to scroll for reaching to the menu.
Smint is a jQuery plugin that can turn any given element into a sticky menu instantly.
Also, the plugin has support for smooth scrolling (which is usually used in one-page websites).
The plugin is almost plug ...

Sliding side menus are widely used in mobile apps as they are only visible on-demand and save space.
jQuery.mmenu is a slick plugin that brings the same behavior into any -mobile- web layout.
It transforms unordered lists with unlimited sub-lists into menu items and has multiple options for customization.
...

There are pretty standard ways to approach navigation when it comes to responsive layouts and, previously, responsive jQuery menu solutions were shared at WRD.
FlexNav is another jQuery plugin for easily handling menus in responsive layouts and it does that well for complex ones too.
The plugin has support ...

On small screens, displaying a button/icon that can show/hide menu items in a single column is a very common method for responsive navigations. Even the icon used is pretty standard.
Responsive-Nav, a JavaScript plugin, simplifies creating such responsive menus with a lightweigt footprint (1.6kb minified-gzipped).
...