Best jQuery Side Menu Plugins & Tutorials with Demo

Offside.js : JavaScript Off-canvas Push Menu

Offside.js : JavaScript Off-canvas Push Menu

Offside.js is a minimal JavaScript kit without library dependencies to push things off-canvas using just class manipulation. It’s goal is to provide a super-lightweight, efficient and customizable way of handling off-canvas menus/elements on modern website and web applications.

Features:

  • Minimal DOM manipulations
  • No library dependencies
  • Uses CSS3 3D transforms (if you want to)
  • No injected style. Offside entirely relies on classes manipulations
  • BEM-like style
  • Degrades gracefully on browsers not supporting CSS3 3D transforms
  • Handles multiple off-canvas elements
  • Left/right off-canvas

hy-drawer : Touch-enabled Drawer Component

hy-drawer : Touch-enabled Drawer Component

hy-drawer is a touch-enabled drawer component for the modern web. It focuses on providing a fun, natural feel in both the Android and iOS stock browser, while being performant and easy to use. It is the perfect companion for mobile-first web pages and progressive web apps.

Pushbar.js : JavaScript Sliding Drawers Plugin

Pushbar.js : JavaScript Sliding Drawers Plugin

Pushbar.js is a tiny javascript plugin for creating sliding drawers in web apps It is fully customizable and dependency free.You can use it as sidebar menus or option drawers.

coreNavigation : jQuery Multi purpose Navigation Menu

coreNavigation : jQuery Multi purpose Navigation Menu

coreNavigation is a multi purpose navigation menu for javascript library based on jquery, come with more style and easy to combination.

Features:

  • 9 Default Menu
  • 2 Responsive Navigation
  • 6 Event Menu
  • 6 Attributes Header
  • 3 Mode Menu Position
  • 9 Layout Navigation
  • More Themes & Custom

jQuery plugin to switch between Mobile & Desktop menu : Menu-breaker.js

jQuery plugin to switch between Mobile & Desktop menu : Menu-breaker.js

Menu-breaker.js is a javascript & jQuery plugin to switch between mobile and desktop menu and change submenus side on browser window resize.

Ideabox : Material Navigation Menu with jQuery

Ideabox : Material Navigation Menu with jQuery

Quick web site menus or admin dashboard navigation do the same google like. with material design.

Features:

  • Fully customizable via CSS
  • Full Responsive
  • Unlimited colors
  • Lightweight and Simple
  • Bootstrap Compatible
  • Clean Code
  • Clean and Material design
  • Multipurpose
  • Material font icons
  • Easy to Customize
  • Easy understanding commented code
  • CSS3 animations

jQuery accessible Offcanvas plugin : js-offcanvas

jQuery accessible Offcanvas plugin : js-offcanvas

A lightweight, flexible jQuery off-canvas navigation plugin which lets you create fully accessible sidebar or top/bottom sliding (or push) panels with keyboard interactions and ARIA attributes.

Features:

  • Uses CSS transforms & transitions.
  • BEM c-offcanvas c-offcanvas--left is-open
  • From Any Direction: left, right, top and bottom.
  • Overlay, Reveal and Push.
  • API & Events

mlStackNav : jQuery Multi-level Stack Navigation

mlStackNav : jQuery Multi-level Stack Navigation

jQuery mlStackNav is a customizable, responsive, accessible, easy-to-use multi-level stack navigation menu with slide effect.

BigSlide.js : jQuery Slide Panel Navigation Plugin

BigSlide.js : jQuery Slide Panel Navigation Plugin

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).

jQuery Sidebars Ultimate Plugin

jQuery Sidebars Ultimate Plugin

This plugin is probably the most extensive tool for quickly creating and configuring any number of sidebars for any direction. Sidebars Ultimate is a lightweight Jquery plugin, it supports a huge number of browsers and mobile devices, is very simple to use and allows to use on any type of website.A lot of options, methods and events create many oportunities, so that your website will gain a unique functionality and look. If you plan to use sidebars on your website, trust me, you want to have this plugin : )