Best jQuery HTML5 Plugins & Tutorials with Demo

    Tipped a beautiful jQuery HTML5 tooltips plugin

    jQuery HTML5 tooltips plugin

    Tipped allows you to easily create beautiful tooltips using the jQuery Javascript library. Tipped takes tooltips to the next level by using HTML5 to give you full control over the look and feel of your tooltips.

    The entire skin of the tooltip, from shadow to loading icon, is drawn using Canvas. This means you can easily change the style of your tooltips without having to create any images.

    Developing a jQuery Private Messaging Modal Box

    jQuery Private Messaging Modal Box

    I have designed the functionality to look and feel like a private messaging solution. This is perfect to implement on a user profile page or author’s page in a blog. We will be using some handy CSS3 techniques along with coding the page structure in HTML5. You don’t need to be a master jQuery artist to understand this tutorial, but it wouldn’t hurt to brush up on the basics.

    jQuery HTML5 Music Player

    jQuery HTML5 Music Player

    Remember that awesome music player psd created by Orman Clark? Well here is the matching jQuery plugin.

    Making a Beautiful HTML5 & jQuery Portfolio

    HTML5 & jQuery Portfolio

    In today’s tutorial we will be making a beautiful HTML5 portfolio powered by jQuery and the Quicksand plugin. You can use it to showcase your latest work and it is fully customizable, so potentially you could expand it to do much more.

    MotionCAPTCHA – jQuery Captcha plugin

    jQuery Captcha plugin

    MotionCAPTCHA is a jQuery CAPTCHA plugin, based on the HTML5 Canvas Harmony procedural drawing tool by Mr Doob and the $1 Unistroke Gesture Regonizer algorithm (and the more recent Protractor algorithm improvement), requiring users to sketch the shape they see in the canvas in order to submit a form.

    Fullscreen Slideshow with HTML5 Audio and jQuery

    Fullscreen Slideshow with HTML5 Audio and jQuery

    In today’s tutorial we’ll create a fullscreen photo slideshow to illustrate a New York picture series. We will add sounds with the HTML5 audio element in order to give life to the gallery and try to recreate the ambient of this vibrant city.

    TagCanvas – jQuery Animated Tag Cloud

    jQuery Animated Tag Cloud

    An HTML5 canvas-based plugin which replaces <a href="..."> links with a 3D rotating cloud of tags.

    Tested in FireFox, Chrome, Opera, Safari. Also tested in IE8, where it obviously doesn’t work except in conjunction with ExplorerCanvas. Now works in the IE9 beta/release candidate without ExplorerCanvas.

    Open Source HTML5 Audio Player: Boombox.js

    html5 jquery audio player

    HTML5 introduces the audio element which offers a way to play audio natively in the browser. However the native controls are a little lacking in style. Thankfully HTML5 also brings Media Element API to interact with which allows us to skin an Audio object however we want.

    Geo Location with HTML5 and Jquery

    google Geo Location with HTML5 and Jquery

    Last few days I have been working with HTML5 elements, it’s very interesting. This post explains you how to get geo location latitude and longitude values using Jquery. I found a geocode location script from html5demos.com and I have customized bit of code. It is useful you can built foursquare kind of location check out web application.

    Create A Multiple URL Shortener Page

    jquery Multiple URL Shortener Page

    There are various url shortener services on the Internet, you can use free services such as bit.ly, tinyURL or create your own url shortener using some open sources. In this article, I’ll show you how to create a simple page that shows short urls created by multiple url shortener services. I’ll use HTML5, CSS3 for styling as well as jQuery for working with Ajax.