Best jQuery Web Plugins & Tutorials with Demo

    jQuery Scroll Path

    jQuery Scroll Path

    A jQuery plugin for defining a custom path that the browser follows when scrolling.The plugin uses canvas flavored syntax for drawing paths, using the methods moveTo, lineTo and arc. To help with getting the path right, a canvas overlay with the path can be enabled when initating the plugin.

    Scrolling can be done with the mousewheel, up/down arrow keys and spacebar. The spacebar scrolls faster than the arrow keys, and holding shift while pressing space will scroll backwards. A custom scrollbar is also included, which allows click and drag scrolling. The scrollbar is enabled by default.

    The plugin also allows rotating the entire page, using CSS transforms. This can be done either along a path, or around the current position. In browsers without CSS transform support, all rotations are ignored, but paths are still followed. This means the plugin works with graceful degradation in all browsers.

    jQuery Pjax : Load HTML From Server without Page Load

    jQuery Pjax : Load HTML From Server without Page Load

    pjax loads html from your server into the current page without a full page load. It’s ajax with real permalinks, page titles, and a working back button that fully degrades.Whenever the time changes, a full page load has happened. If the time doesn’t change, no full page load has occurred.

    The idea is you can’t tell the difference between pjax page loads and normal page loads. On complicated sites, browsing just “feels faster.”

    List.js – Add search, sort and flexibility to plain HTML lists with jQuery

    List.js - Add search, sort and flexibility to plain HTML lists with jQuery

    Do you want a 9 KB cross-browser native JavaScript that makes your plain HTML lists super flexible, searchable, sortable and filterable? Yeah!
    Do you also want the possibility to add, edit and remove items by dead simple templating? Hell yeah!

    Scrolldeck : jQuery scrolling presentation decks plugin

    Scrolldeck : jQuery scrolling presentation decks plugin

    Scrolldeck a jQuery plugin for making scrolling presentation deck.After linking all the required scripts (jQuery, Scrollorama, scrollTo, easing & scrolldeck), create the slide deck on document ready event.Add animations to slides by adding the “animate-in” or “animate-build” classes to elements in your slides.

    turn.js – jQuery plugin Page Flip effect for HTML5

    turn.js - jQuery plugin Page Flip effect for HTML5

    Turn js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine for HTML5. Being inspired by the effect of iBooks and Maps for iOS, I created two classes: one for manipulating the overall publication and another for each individual page. The last one is completely independent, in that it offers an API for creating its own implementations.Having some features :

    •  Uses Hardware acceleration
    • Works on tablets and smartphones
    • Easy to manipulate
    • Lightweight, only 15K

    Bear CSS : jQuery build a solid stylesheet foundation based on your markup

    Bear CSS : jQuery build a solid stylesheet foundation based on your markup

    Bear CSS is a handy little tool for web designers. It generates a CSS template containing all the HTML elements, classes & IDs defined in your markup.

    Bear CSS was created using a combination of HTML5/CSS, jQuery and PHP, with some help from the following plugins:

    • PHP Simple HTML DOM Parser
    • Uploadify

    Response JS : jQuery plugin for mobile-first progressive enhancement in HTML5

    Response JS : jQuery plugin for mobile-first progressive enhancement in HTML5

    Response JS is a lightweight jQuery plugin that gives web designers tools for building performance-optimized, mobile-first responsive websites. It provides semantic ways to dynamically swap code blocks based on breakpoints and serve media progressively via HTML5 data attributes. Its object methods give developers hooks for triggering responsive actions and booleans for testing responsive properties.

    LionBars : jQuery OSX style scrollbars

    LionBars : jQuery OSX style scrollbars

    Lionbars is a free jQuery OSX style scrollbars.It is Lightweight, cross-browser, cross-platform.

    Glimmer a jQuery Animation effect plugin

    Glimmer a jQuery Animation effect plugin

    Another great animation effect for jQuery lovers, you can see how the landscapes moves.Glimmer allows you to easily create interactive elements on your web pages by harnessing the power of the jQuery library. Without having to hand-craft your JavaScript code, you can use Glimmer’s wizards to generate jQuery scripts for common interactive scenarios. Glimmer also has an advanced mode, providing a design surface for creating jQuery effects based on your existing HTML and CSS.By using Glimmer you can make rotating image banners,beautiful tooltips, Dropdown menus and lot of other animation effects.

    Facebook Timeline Design using JQuery and CSS

    Facebook Timeline Design using JQuery and CSS

    I’m going to discuss about Jquery usage. Facebook timeline design makes big revolution in social networking world and it gives new feel to the user profile pages. In this post I want to explain how simple I had implemented this design with Jquery and CSS. Try this demo with modern browsers like Chrome, Firefox and Safari (IE is dead).