Best jQuery Menus Plugins & Tutorials with Demo

    Dynamic Shape Overlays with SVG

    Dynamic Shape Overlays with SVG

    Today we’d like to share another way of achieving morphing page transitions. This time, we’ll generate multiple SVG curves with JavaScript, making many different looking shapes possible. By controlling the individual coordinates of the several layers of SVG paths, the curved shapes animate to a rectangle (the overlay) with a gooey motion. We use some nice easing functions from glsl-easings and by tuning the curve, speed and the delay value, we can generate many interesting effects.

    jQuery Multi level Push Menu Plugin

    jQuery Multi level Push Menu Plugin

    Multi-level push menu is cross-browser compatible jQuery plug-in allowing endless nesting of navigation elements.This jQuery plugin is inspired by Codrops MultiLevelPushMenu but unlike it not relaying on CSS 3D Transforms and therefore functional in older browsers too (i.e. IE 8).

    Features:

    • Multi-level menu support
    • Endless nesting of navigation elements
    • Expand/Collapse navigation with a left/right swipe gesture
    • Push/Slide DOM elements of choice
    • Left-to-right and Right-to-left sliding directions
    • Flexible, simple markup
    • JS Array input, if markup is not present
    • A number of exposed Options, Methods and Events
    • Cross-browser compatibility (IE8+, Chrome, Midori, Firefox, Safari, Opera, Android Browser, iOS Safari)

    menuUI : jQuery Bootstrap Menu with JSON

    menuUI : jQuery Bootstrap Menu with JSON

    menuUI is a simple plugin to generate bootstrap nav bar from a json object.

    jQuery Right-click Context Menu

    jQuery Right-click Context Menu

    This jQuery plugin makes it easy to add right-click context menu functionality to any web application. A context menu can help make a web application feel even more like a native application.

    • Supports keyboard control
    • Always stays in viewport (menus never open outside of the visible area)
    • Supports infinite amount of sub-menus
    • Enable disable items or entire menus
    • Add and remove items and let the menu refresh
    • Show non-menu items like images or forms
    • Supports right- or left-click control

    sideToggle : jQuery plugin for Toggling Elements Sideways

    sideToggle : jQuery plugin for Toggling Elements Sideways

    This is a small jQuery plugin that toggles elements sideways, rather than the up-and-down default of jQuery’s toggle. There are three versions available for use; one of them uses an extra Javascript library called Velocity.js that offers a performance gain over jQuery’s .animate(), but it likely won’t be necessary for small use.

    MEGA : jQuery Responsive Megamenu Navigation

    MEGA : jQuery Responsive Megamenu Navigation

    A Responsive Megamenu plugin made to enhance your website navigation. Versatile, fully customizable and easy to use!

    • Fully Responsive
    • Vertical or horizontal dropdowns
    • Left, Center and Right alignment
    • Tabs an lists
    • Bootstrap Compatible
    • SASS files

    Hiraku.js : jQuery Offcanvas Menu Plugin

    Hiraku.js : jQuery Offcanvas Menu Plugin

    We made jQuery plugin called hiraku.js so that more people can use Offcanvas-menu functionality which is used in a CMS we make.

    Features:

    • Not affected by the DOM structure.
    • Enable to open both right and left side menu.
    • Main canvas is not scrolled, while scrolling Offcanvas-menu.
    • Easy to control the movement
    • Accessible for keyboard navigation and screen readers.

    Ember Burger Menu : Off-canvas Sidebar

    Ember Burger Menu : Off-canvas Sidebar

    An off-canvas sidebar component with a collection of animations and styles using CSS transitions.

    Features:

    • Easy to use & setup off-canvas menu
    • Mix and match from many menu & menu item animations
    • Control your menu from anywhere in your app
    • Swipe gesture support with changeable thresholds
    • Easily create your own animations

    Sweet and versatile Dropdowns using jQuery

    Sweet and versatile Dropdowns using jQuery

    Sweet and versatile dropdowns using jQuery.Create dropdowns in any direction with any kind of content.

    Attractive fully Responsive Menu using CSS3

    Attractive fully Responsive Menu using CSS3

    A fully responsive navigation using css3 and jQuery which is very attractive with animated effects. In this header, you can see clean navigation items with search and in mobile/tablet you can see attractive toggle menu with animated open/close effects.