3 great jQuery plugins for slide-in mobile navigation

With the obvious lack of screen real estate on mobile devices, despite recent increases, creating user friendly navigation menus is pretty important. Personally, I find simple drop-down menus to be a little clunky and can cause problems if the user has to scroll. I much prefer menus that fold out from the side with their own scrollable area.

This article will run through a few of jQuery scripts that I have found which assist in creating slide-in navigation menus that you can use on any device including mobile/cell phones. Whether you are creating an adaptive or responsive website or just a mobile site, these may work for you.

Slidebars is a jQuery plugin created by Barcelona based front-end developer Adam Smith. It is lightweight and easy to implement that uses CSS transitions with jQuery animate fallback. Slidebars features pre-defined CSS classes for attaching to elements as well as an API for extending functionality.

Created by full stack web developer Alberto Varela, out of Bilbao in Span, Sidr is a fully featured plugin based on the Facebook menus. Sidr allows for multiple menus on a single page as well a number of ways for loading the menu content. Included is a light and a dark theme, however you can create your own if you wish.

jPanelMenu is a plugin with plenty of options and flexibility. Philadelphian developer Anthony Colangelo is the brains behind the project, developing and maintaining the plugin since 2012. jPanelMenu leaves the styling up to our own tastes and can also be paired with the jRespond plugin to control scripts at different breakpoints.

Have you come across any other good slide-in navigation menus? Let me know below, as well as your thoughts on those above.