10 jQuery Slide-Out Navigation Panel Plugins

You probably noticed that there are many mobile applications that make use of a panel that slide from the side of the screen and display additional information – typically more navigation options. These sliding panels are very useful since the allow a quick display of information that is typically accessible from any where in the application. So here are 10 jQuery plugins to help you to toggle or hide your contents either by clicking or hover on a hook button.


bigSlide is a teeny tiny (~1kb compressed) jQuery plugin for creating off-screen slide panel navigation. It will slide the navigation panel as well as any containers given the .push class (or a class of your choosing in the settings).


Pull-Out Content Panel

This panel has been created to fit into any website with a clean and professional design. It can be fixed on the left or on the right and can contain any type of content : headings, texts, lists, images, videos, etc. The custom scrollbars packed in this menu will automatically appear when needed and if you need to add even more content, you can use the infinite carousel to scroll between each part of the panel.



Sidr is a jQuery plugin for creating side menus and the easiest way for doing your menu responsive.


A jQuery plugin for creating slick, app look-alike sliding menus for you mobile website with only one line of javascript.


Navigation is one of the most important aspects of a website. The fly-out menu has been proven to be the most efficient navigation that dramatically can improve your visitors experience on your website!


jPanelMenu is a clean and modern jQuery menu that helps to create a Paneled-Style Navigation for your web application or website.

jQuery Mobile

A sliding menu similar to Facebook and Path’s approach to menu design on mobile.

Side Toggle Menu

Side Toggle Menu lets you add a side bar menu to your page that slides in from the left or right edge of the browser window. It supports two types of unveiling- either by nudging the rest of the page and making room for itself, or overlaying the page (and not displacing its neighbours). CSS3 transitions are used to power the animation, ensuring a smooth visual experience even on low powered mobile devices.


PageSlide a jQuery plugin which slides a webpage over to reveal an additional interaction pane.


A quick and easy way to add a contextual ajax sliding panel to your site.


Leave a comment

Please be polite. We appreciate that. Your email address will not be published and required fields are marked

This site uses Akismet to reduce spam. Learn how your comment data is processed.