Best jQuery Responsive Plugins & Tutorials with Demo

    jQuery ReSmenu – Select based Responsive menu

    jQuery ReSmenu - Select based Responsive menu

    jQuery ReSmenu is a very simple and lightweight (~1Kb) jQuery plugin that collapse ul menus into selects on responsive layouts.

    InfinitySlider – jQuery Slider with CSS3 Animations

    InfinitySlider - jQuery Slider with CSS3 Animations

    Modern, Customizable, Clean, Fluid and Responsive. Responsive effects by default and fully compatible with Desktop, Notebook, Tablet, Smarphone, Firefox, Chrome, Opera, Safari and Internet Explorer.Image Autofit is an awesome feature that allows you to responsive your images automatically by cutting its edges and resizing its sizes, to preserve a high definition on every device and create an awesome slider for desktop and mobile.

    Features:

    • Super-Fluid CSS3 Effects & Transitions on Desktop & Mobile
    • You can select your IN/OUT/BACK Times for each element
    • HTML & CSS Content supported, you can add texts, images, videos, canvas, pricing tables, and all you want.
    • Fully Support of Video Embedding as Fullscreen or Boxed
    • Youtube & Vimeo API that stops the video if you change the slide
    • Image Autofit that allows you to select the subject position on the images
    • Cinematic Effect that allows you to make an animation-movement of the images
    • Blur Effect that allows you to make an automatic blur image from a normal one
    • Fully Cross-Browser Compatibility
    • Bootstrap 3 Integrated so you can use all the Bootstrap Elements inside the slide
    • Easy to integrate with other Frameworks
    • Font Awesome 4 Integrated
    • Fully Responsive
    • Play & Stop with the slide loader
    • Autoplay, you can active it to start your slide when the page is opened
    • Keyboard Navigation

     

    Wrangle : jQuery Touch-friendly plugin to wrangle up your Images

    Wrangle : jQuery Touch-friendly plugin to wrangle up your Images

    Wrangle is an experimental plugin that will have you rustling up your herd of photos like a real cowpoke. Our tool gives your app a new way to perform multiple selections — using your mouse … or even your fingers! So grab your lassos. This tool’s your huckleberry.

    Wrangle is a responsive, touch-friendly selection plugin for jQuery or Zepto. Wrangle offers a unique method of multiple selection: by drawing a line through items to select them. The plugin is lightweight and designed to be exstensible and adaptable. It’s also highly experimental, due in no small part to the diversity of touch implementations in various devices and browsers.

    RowGrid.js : jQuery plugin for placing Items in straight rows

    RowGrid.js : jQuery plugin for placing Items in straight rows

    rowGrid.js is a small, lightweight (~800 bytes gzipped) jQuery plugin for placing images (or other items) in straight rows.RowGrid.js justifies the items in straight rows so that the width of the rows equals the width of the container/parent element. At first rowGrid.js adjusts the margin between the items. If this is not enough rowGrid.js scales down the items.

    The grid is similar to grids on Google Image Search, flickr, shutterstock and Google+ images.

    Features:

    • responisve
    • infinite scrolling

    ScrollMagic : jQuery plugin for Magical Scroll Interactions

    ScrollMagic : jQuery plugin for Magical Scroll Interactions

    ScrollMagic is a jQuery plugin which essentially lets you use the scrollbar like a progress bar.It’s the plugin for you, if you want to start an animation at a specific scroll position, synchronize an animation to the scrollbar movement, easily add a parallax effect to your website, pin an element at a specific scroll position.

    Features:

    • optimized performance
    • flexibility
    • mobile compatibility
    • ready for responsive webdesign
    • object oriented programming and object chaining
    • event management
    • support for both scroll directions (even different on one page)
    • support for scrolling inside div containers (even multiple on one page)
    • extensive debugging and logging capabilities

    CSS Drawer menu : Pure CSS Responsive Menu

    CSS Drawer menu : Pure CSS Responsive Menu

    An ultra light mobile side “drawer” menu in pure css.

    Features:

    • Responsive
    • Percentage based!
    • ULTRA Lightweight!
    • PURE CSS! (2kb uncompressed)

    jRMenuMore – jQuery plugin for Responsive Menu with More Option

    jRMenuMore - jQuery plugin for Responsive Menu with More Option

    jRMenuMore is a jQuery plugin for Responsive Menu or Navigation Bar with More option.

    FH Mega Menu – jQuery Bootstrap 3 Mega Menu Plugin

    FH Mega Menu - jQuery Bootstrap 3 Mega Menu Plugin

    The FH Mega Menu is a jQuery based Bootstrap 3.0+ mega menu plugin compatible with all mobile devices and modern web browsers.

    Features:

    • 100% Responsive Layout Design
    • 100% Twitter Bootstrap 3.0+ Based
    • Unlimited Color Schemes
    • 3 Easy Step to Installation to any Web Projects
    • Detailed Documentation for “How to”
    • Flexible and 100% Bootstrap Columns Grid
    • Font Awesome Icons Included
    • Responsive Video and Google Map Integrated (Fitdivjs)

    Real 3D FlipBook – Responsive WordPress Plugin

    Real 3D FlipBook - Responsive WordPress Plugin
    • The most realistic paper animation
    • real 3d – lights, shadows, page bending
    • easy to use and customize
    • responsive design – book resizes so it fits screen width or screen height depending on the layout, thumbnails are placed horizontally or vertically depending on the layout
    • optimized for mobile – look and feel of a native app on mobile with touch swipe, pinch zoom etc
    • no Flash Player needed to run
    • smart page loading – only current pages are loaded
    • choose between 3 types of flip animation – webgl realistic 3d, jquery 2d or CSS3 3d flip animation customizable animation speed and transition type
    • show all pages – thumbnails
    • table of content – customizable
    • advanced zooming support with mouse wheel zoom on desktop, pinch zoom on mobile, scrollbars when zoomed, touch swipe, click and drag
    • zoom in and out buttons
    • real fullscreen support – if fullscreen is not supported by the browser, the icon will not be shown in the menu, if fullscreen is supported it will expand the book in real full screen mode, not browser full screen
    • retina friendly icons – icon font used for menu icons, fully customizable – change color, size, add drop shadow ect.
    • customizable menu – use only icons that you need
    • social share – facebook, twitter, google plus. linkedin
    • 3 skins included, customizable skins through CSS
    • 10 background patterns included

    jQuery responsive gallery and lightbox – jrGal

    jQuery responsive gallery and lightbox - jrGal

    jQuery responsive gallery and lightbox – (jrGal).This script allows you to embed a slick responsive gallery into your website page or mobile app. Its easy to setup and works smoothly.

    If you are creating a mobile-viewable (responsive) website. This gallery/lightbox will work fluidly with any screen size! It automatically adjusts to fit the view port size. Desktop OR mobile