Best jQuery Web Plugins & Tutorials with Demo

    jStorage – store data locally with JavaScript

    June 27, 2012 | HTML5, jSON, Other Libraries, Plugins, Web, XML
    jStorage - store data locally with JavaScript

    jStorage is a simple wrapper plugin for Prototype, MooTools and jQuery to cache data (string, numbers, objects, even XML nodes) on browser side. Note that functions, DOM nodes, host objects and such can not be saved.jStorage was first developed under the name of DOMCached but since a lot of features were dropped to make it simpler (like the support for namespaces and such) it was renamed. DOMCached had separate files for working with Prototype and jQuery but jStorage can handle both in one go.

    jStorage makes use of HTML5 local storage where available and userData behavior in Internet Explorer older versions. Webkit SQLite is not supported.

    Read More Demo

    Smart Wizard : jQuery plugin that gives wizard like Interface

    June 26, 2012 | Ajax, Animation, Menus, Web
    Smart Wizard : jQuery plugin that gives wizard like Interface

    Smart Wizard is a flexible jQuery plug-in for wizard like interface. It allows to group contents into sections and so it saves page space and also gives a neat and stylish interface for users. Using Smart Wizard 2.0 you can easily do input validation and so it is good for user registration and kind of tasks.

    Features:

    • Easy to implement, Minimal HTML required.
    • Ajax contents loading option.
    • Cool animation effects on step navigation. (none/fade/slide/slideleft)
    • Keyboard navigation option.
    • Horizontal and vertical style step anchors.
    • Easy step input validation option
    • Option to highlight error steps
    • In-built message box
    • Easy navigation with step anchors and navigation buttons
    • Can have multiple wizards on same page
    • Option to enable all steps on first load
    Read More Demo

    IE Alert js : let your visitors upgrade their browser with jQuery

    June 20, 2012 | Plugins, Web
    IE Alert js : let your visitors upgrade their browser with jQuery

    IE Alert is a handy jQuery plugin that shows a well designed warning message to the visitor who’s trying to view your site with an older version of Internet Explorer browser, this warning message will convince your visitors to upgrade their browser to a newer version of Internet Explorer or to an another web browser.

    Read More Demo

    Responsly.js : A set of CSS3 responsible widgets for jQuery

    June 20, 2012 | CSS2 / CSS3.0, Plugins, Responsive, Web
    Responsly.js : A set of CSS3 responsible widgets for jQuery

    Dead simple responsive widgets, written using CSS3 transformations and available as a jQuery Plugin. Currently a sideshow and accordion are available, more to come!.Responsive designs are cool! Not only do they allow you to reach mobile and tablet users with minimal effort, they also make your context scale up for desktop users with larger screens.
    Features

    • Works from large monitors to laptops, to tablets to mobiles.
    • Pure CSS styling
    • CSS3 based transitions (hardware accelerated where possible).
    • Animations work on all modern browsers including mobile, (IE degrades gracefully by losing transitions).
    • Minimal dependence on jQuery for convenience ( can substitute Zepto, or pure JavaScript).
    • Simple lightweight design, adds little to your download size
    • Compartmentalized, so use only what you want
    • Best used with a responsive CSS framework like 1140px or 320plus
    • Can be heavily customized by editing CSS
    Read More Demo

    jQuery Stepy – A Wizard Plugin

    June 20, 2012 | Plugins, Web
    jQuery Stepy - A Wizard Plugin

    jQuery Stepy is a plugin based on FormToWizard that generates a customizable wizard.

    Read More Demo

    RingShare: best way to share your content in jQuery

    June 18, 2012 | Plugins, Premium, Web
    RingShare: best way to share your content in jQuery

    RingShare could be apllied to any html element and could be customized for your own needs. and works in all recent browsers: Firefox, Chrome, Opera, Safari and Internet Explorer 7,8,9 as well as Mobile Safari on iPhone/iPad.

    Features

    • Easy to integrate
    • Cross browser support
    • Customizable
    • Documentation & Example included
    Read More Demo

    Building a List/Grid View Switcher with jQuery

    June 18, 2012 | CSS2 / CSS3.0, Web
    Building a List/Grid View Switcher with jQuery

    A fairly common web interface feature is the dynamic view switcher. On product pages or blog archives you’ll sometimes find buttons to change the layout from display lists to smaller grids. In this tutorial I’ve built a simpler example using basic CSS and some jQuery commands.

    I’ll be using interface elements from the Zephirro E-Commerce UI Set which include buttons and thumbnail photos. Feel free to demo the code yourself and try out a similar experience on your own website. This is a tricky effect to nail down, but when done properly your users will love the unique experience.

    This tutorial should give you a strong introduction to manipulating your page layouts with jQuery. Even the simple action of mixing up classes & IDs can boldly enhance the user experience.

    Read More Demo

    Html5 loader : jQuery preloader plug-in

    June 16, 2012 | HTML5, jSON, Plugins, Web
    Html5 loader : jQuery preloader plug-in

    Now you can preload your HTML 5 page with this nice plug in, passing data via JSON. You can customize it changing colors and style. It can preload video, audio, images and js

    Read More Demo

    Create a Parallax Scrolling Website Using Stellar.js

    June 15, 2012 | Plugins, Web
    Create a Parallax Scrolling Website Using Stellar.js

    One of the biggest trends in recent modern web design is use of parallax scrolling effects. In this tutorial I’m going to show you how you can create the effect on your own website, with a bit of imagination and a little help from Stellar.js.

    When combined with the scrolling functionality of a website, parallax scrolling effects can have a strong visual impact, especially when combined with some form of story which takes you on a journey.Parallax is a displacement or difference in the apparent position of an object viewed along two different lines of sight.

    Read More Demo

    jQuery Picture : Responsive images plugin

    June 15, 2012 | jQuery Mobile, Plugins, Responsive, Web
    jQuery Picture : Responsive images plugin

    jQuery Picture is a tiny (2kb) plugin to add support for responsive images to your layouts. It supports both figure elements with some custom data attributes and the new proposed picture format. This plugin will be made redundant when the format is approved and implemented by browsers. Lets hope that happens soon but in the meantime this plugin will be kept up to date with latest developments.

    Read More Demo