Best jQuery HTML5 Plugins & Tutorials with Demo

    Hi Slider : jQuery eye-catching 2D/3D realistic Slider

    Hi Slider : jQuery eye-catching 2D/3D realistic Slider

    Hi Slider makes it easy for anyone to create awesome eye-catching 2D/3D realistic jQuery Slider without any programming skills. Creating an image gallery slider and making a customized WordPress slider plugin have never been so easy and intelligent, even non-coders can design gorgeous jQuery photo slideshow. You just need to “Click to Select”! You can publish a gorgeous slider for your website within minutes!

    Matter.js : 2D Rigid body physics Engine for the web

    Matter.js : 2D Rigid body physics Engine for the web

    Matter.js is a 2D rigid body physics engine for the web written in JavaScript (yes, another).

    Features:

    • Physical properties (mass, area, density etc.)
    • Rigid bodies of any convex polygon
    • Stable stacking and resting
    • Restitution (elastic and inelastic collisions)
    • Conservation of momentum
    • Friction and resistance
    • Constraints
    • Gravity
    • Composite bodies
    • Sleeping and static bodies
    • Original JavaScript physics implementation (not a port)
    • HTML5 canvas renderer (optional)
    • Mobile-compatible (touch, scaleable)
    • Cross-browser (chrome, firefox, IE8+)
    • World state serialisation (requires resurrect.js)
    • Built in GUI for testing (requires dat.gui.js)
    • Time scaling (slow-mo, speed-up)
    • Broad-phase, mid-phase and narrow-phase collisions
    • Events (edge)
    • Sprite texture rendering (edge)

    Funky.js : HTML5 camera video effects library

    Funky.js : HTML5 camera video effects library

    funky.js is a library used to add some funky effects and other transformations to webcam media using WebRTC and CSS filters (aka shaders).

    Currently, Firefox does not provide full support for the filter property whereas Chrome does. For this reason, the Negative and Sepia effects will not function correctly unless using Chrome.

    jFlat : HTML5 – jQuery Plugin change flat icons color

    jFlat : HTML5 - jQuery Plugin change flat icons color

    jFlat is the plugin to convert flat icons color. This plugin is only for HTML5 supported browsers. This plugin uses HTML5 canvas element to change flat icons color.

    Concept of the Plugin:

    1. jFlat plugin will identify the jFlat applied image elements.
    2. It will create HTML5-canvas element with same height and width of applied image element
    3. It will hide the applied image element

    jQuery ImageMap Area Canvas Editor

    jQuery ImageMap Area Canvas Editor

    jQuery plugin to create imagemap area polygon coordinates. Extends a text input to display an image with a canvas on which points may be added to create a polygon.

    Html5 MP3 Light Player

    Html5 MP3 Light Player

    MP3 Light Player is a powerful responsive HTML5 mp3 player for your website that runs on all major browsers and mobile devices like iPhone, iPad, IOS, Android and Windows8. MP3 Light Player supports unlimited playlists and each playlist can have unlimited tracks. The playlists can be loaded from a simple HTML markup, XML file, mp3 folder, Podcasts, Official.fm and SoundCloud playlist. Packed with a huge amount of features like, external API, deeplinking, popup window and facebook share button.

    Facebook’s Paper photo tilt feature in HTML5

    Facebook's Paper photo tilt feature in HTML5

    HTML5 clone of the photo tilt feature/gesture/ux found in Facebook’s Paper app.

    HTML5 Video Player like YouTube in jQuery plugin

    HTML5 Video Player like YouTube in jQuery plugin

    VideoControls is a open source free plugin made in jQuery for display a YouTube-Like control bar. Based on the new HTML5 tag <video>, VideoControls is cross platform, simple and free to use.

    Features:

    • Free & Open Source
    • Easy to use
    • Lightweight
    • Based on jQuery
    • 100% skinnable using CSS
    • Consistent look between browsers
    • Preview on timebar mouse over
    • Markers on timebar
    • Buffer loading visibility
    • Full screen
    • Play/pause, seek
    • Volume Control
    • Mute/unmute
    • Mobile compatible

    Alpaca : Easy HTML5 Forms for jQuery

    Alpaca : Easy HTML5 Forms for jQuery

    Alpaca is the Easy Forms Engine for jQuery and Twitter Bootstrap.

    It is built around JSON schema to keep things simple. Using Alpaca, you can express your forms object model, types, properties and validation logic. Forms rendered with Alpaca provide intuitive interfaces for your users while giving your business an assurance of data compliance.

    Alpaca comes pre-configured to work nicely with the following web frameworks:

    • jQuery
    • Twitter Bootstrap
    • jQuery UI
    • jQuery Mobile
    • Barebones (empty CSS)

    The Alpaca library is pre-packaged with controls, wizards, layouts, I18N support and pluggable template engines. We ship with support for jQuery Tmpl, EJS and Handlebars. Documentation and API information is provided so that you can extend Alpaca as you see fit.

    GalleryModule : Html5 CSS3 & jQuery Single Page Gallery

    GalleryModule : Html5 CSS3 & jQuery Single Page Gallery

    GalleryModule : Html5 CSS3 & jQuery Single Page Gallery.