Best jQuery HTML5 Plugins & Tutorials with Demo

    jSound : jQuery plugin for playing sounds on any html tag element

    jSound : jQuery plugin for playing sounds on any html tag element

    JSound is a simple jQuery plugin for playing sounds on any html tag element ,it works only on modern browser with html5.
    You can define sounds everytime the cursor hover or clicks an element or leaves the element.Kinda like that awesome music Google Doodle.

    mColorPicker : A simple lite jQuery color picker plugin with Html5

    mColorPicker : A simple lite jQuery color picker plugin with Html5

    A simple lite jQuery color picker plugin with a swatch to remember the last 10 colors chosen, that uses html5 markup.

    dumbFormState.js : jQuery Html5 plugin Automatically saves Form State

    dumbFormState.js : jQuery Html5 plugin Automatically saves Form State

    This jQuery html5 plugin automatically saves and persists form state on the client-side across page requests without need of server-side state management or cookies. ALL the major browsers support this!

    features

    • keeps the state of form entries in browser session or across sessions without cookies
    • able to choose form entries not to persist
    • works across multiple forms and pages
    • automatically persists form data without submit
    • can remove persisted data in a form, a session, local or all
    • plays nicely with your form events
    • fails gracefully on unsupported devices

    D3 Cloud : Create word clouds in JavaScript & Html5

    D3 Cloud : Create word clouds in JavaScript & Html5

    D3 Cloud is a Wordle-inspired word cloud layout written in JavaScript. It uses HTML5 canvas and sprite masks to achieve near-interactive speeds. This layout requires D3. It’s similar to d3.layout.force, in that it’s asynchronous and stateful.

    EasyStar.js : Javascript A* Pathfinding library for HTML5 games

    EasyStar.js : Javascript A* Pathfinding library for HTML5 games

    A* is an algorithm for finding the shortest path between two points. It is very useful in game development. Any tile-based game that requires this kind of movement will probably utilize some form of A*. Tower Defense games, City Building games, Rogue-Likes, the list goes on.Thus EasyStar.js is a simple A* API written in Javascript.

    Features:

    • The ability to spread out your calculations over multiple calls. EasyStar.js lets you specify how many calculations should be performed each call.
    • The ability to add separate points to avoid, outside of those that are avoided based on tile type.
    • The ability to specify which tile types are walkable, and which are unwalkable.
    • EasyStar calls a callback if it finds your path, or if there is no possible path.

    Paper.js : Swiss Army Knife of Vector Graphics Scripting

    Paper.js : Swiss Army Knife of Vector Graphics Scripting

    Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming interface.

    Paper.js is easy to learn for beginners and has lots to master for intermediate and advanced users.

    JackBox : jQuery Responsive Lightbox

    JackBox : jQuery Responsive Lightbox

    JackBox is a Responsive Lightbox with Real Social Sharing.

    Features:

    • Responsive / Mobile Ready
    • Retina Ready Graphics
    • Share any item through Twitter, Facebook, Pinterest and Google+
    • Deep-linking, every item has it’s own unique link
    • Touch Swipe for Mobile Devices
    • Genuine Fullscreen for Firefox and Chrome
    • Group any items together and create item categories
    • Youtube Video w/ Mobile Fallback
    • Vimeo Video w/ Mobile Fallback
    • Automatic Youtube and Vimeo thumbnail loading
    • HTML5 Video w/ Flash backup
    • HTML5 Audio w/ Flash backup
    • Flash Video w/ Mobile Backup
    • Load HTML Divs, iFrames and Google Maps
    • A boatload of Custom Thumbnail Hovers and Tooltips
    • CSS3 Preloader for smoother animation

    Sketch : Draw squiggly sketches in 3D with Hmtl5 & JavaScript

    Sketch : Draw squiggly sketches in 3D with Hmtl5 & JavaScript

    Sketch is a drawing tool with a twist; it allows you to draw in pseudo 3D. Sketches can be saved by users and viewed in a gallery.

    The front end is built using the HTML5 canvas element and plenty of JavaScript. Sketches are saved in a MySQL database and PHP is used as a mediator between front end and database.

    Pure HTML5 Charts by jqChart for jQuery

    Pure HTML5 Charts by jqChart for jQuery

    jqChart takes advantages of HTML5 Canvas to deliver high performance client-side charts and graphs across browsers (IE 6+, Firefox, Chrome, Opera, Safari) and devices, including iOS and Android mobile devices. Full Touch support.

    Features:

    • High performance. Uses pure HTML5 Canvas rendering
    • Cross-browser support – tested with IE 6+, Firefox, Chrome, Opera, Safari
    • Supports iOS and Android mobile devices
    • Full Touch Support
    • Bar, Column, Pie, Line, Spline, Area, Scatter, Bubble, Radar, Polar Charts
    • Stock and Candlestick Financial Charts
    • Real-Time Charts
    • Scrolling/Zooming
    • Animations

    MelonHTML5 – All in One Tab with jQuery

    MelonHTML5 - All in One Tab with jQuery

    This is a fully customizable tab solution with pure HTML5 + CSS3 animations for your website.

    Features:

    • Full HTML5 + CSS3 animations (no jQuery UI)
    • 10 preset animations
    • Customizable tab menu position
    • Sliding control
    • Tab position indicator (Android Style)
    • Dropdown shortcuts
    • Keyboard navigation (Left/Right arrow key control)
    • Slideshow
    • Free support & frequent updates