Best jQuery Video & Audio Plugins & Tutorials with Demo

Custom CSS3 Video Players With HTML5 and jQuery

Custom CSS3 Video Players With HTML5 and jQuery

In today’s multimedia web it’s becoming an ever increasing part of web design to include videos. Customizing the video player is one of the first things web designers think about when implementing these elements, as often the default player does not match the website, or merely for consistency across browsers and devices. In this tutorial we’re going to be going through exactly how to do that.

Last.FM for jQuery

Last.FM for jQuery

A plugin to grab your recently played tracks from Last.FM’s api using jQuery and Json. Future versions will support other feeds such as favourites and most listened.

It’s very simple! I’ve always found plugins like this irritating when they force you to use their HTML. For people without jquery knowledge digging around in the plugin file to change that HTML is pretty annoying. For this reason I’ve made the Last.FM plugin very flexible.

Youmax 1.0 : jQuery plugin Show complete Youtube channel on your website

Youmax 1.0 : jQuery plugin Show complete Youtube channel on your website

This is NOT another small youtube widget or a video box to be shown on the right side of your website. This is the real deal. Now show your actual complete youtube channel on your website just like its shown on youtube.

Youmax plugin will display your channel uploads, playlists and a featured playlist that you may choose. Users can browse through your playlists and uploads and watch videos they like. Introducing Youmax 1.0! Check out the demo!

jWebAudio: jQuery Web Audio library for games

jWebAudio: jQuery Web Audio library for games

Web Audio seeks to process and synthesize audio in web applications. jWebAudio keeps the technical details of Web Audio under the hood and makes it easier to control your audio.jWebAudio focuses on audio control of web games and provides functions that most frequently used in game developing, which makes it a light-weight (9.0kb for minified standard version) but well-featured audio library.

With jWebAudio, you can add sound effects (e.g.: telephonize) in a simple way. And if you want to make your own sound effects, you can achieve this by setting Biquad Filter parameters.

With 3D sound effect, you can set parameters like position and velocity of the sound source, making it feel like being in a 3D environment.

Yunero : jQuery plugin displays a video feed for YouTube channel uploads

Yunero : jQuery plugin displays a video feed for YouTube channel uploads

Now you can bring your Youtube uploads to your websites with “Yunero” – a new jQuery plugin that creates a widget on your website. Just specify your youtube channel URL and this widget will display the recent uploads from your channel. You may also specify your youtube playlist URL and video feeds from your playlist will be displayed. A subscription box for you is also shown to attract social people.

howler.js : Modern Html5 Web Audio Javascript Library

howler.js : Modern Html5 Web Audio Javascript Library

Howler.js is a JavaScript library that works with Web Audio API by default and falls back to HTML5 Audio when not supported.

Features:

  • Defaults to Web Audio API
  • Falls back to HTML5 Audio
  • Supports multiple file formats to support all browsers
  • Automatic caching for Web Audio API
  • Implements cache pool for HTML5 Audio
  • Per-sound and global mute/unmute and volume control
  • Playback of multiple sounds at the same time
  • Easy sound sprite definition and playback
  • Fade in/out sounds
  • Methods can be chained
  • Uses no outside libraries, just pure Javascript
  • Lightweight, 7kb filesize (2kb gzipped)

fluidvids.js : Fluid and responsive YouTube and Vimeo videos with JavaScript

fluidvids.js : Fluid and responsive YouTube and Vimeo videos with JavaScript

FluidVids.js is a javascript plugin that allows iframes containing youtube or vimeo embeds to be fluid width, for responsive and fluid development.

SPEAKKER : JavaScript & HTML5 Crossbrowser Audio solution

SPEAKKER : JavaScript & HTML5 Crossbrowser Audio solution

Comes out of the box in two variations and with incredible options of customization: Flexible dimensions, unlimited colors and two different button sets for light and dark themes. Easy to set up. Just a few lines of Javascript and a quantum CSS.

jQuery.WebcamQRCode : QR Code scanning in jQuery

jQuery.WebcamQRCode : QR Code scanning in jQuery

WebcamQRCode is a jQuery plugin that uses the webcam user to scan a QR code and return the result to Javascript to be treated. This plugin was originally developed to scan the barcode of the product and automatically fill in the corresponding information on the form of an intranet.This plugin uses Flash to access the webcam.

SFX.js : Simple JavaScript audio wrapper for easy Sound Effects

SFX.js : Simple JavaScript audio wrapper for easy Sound Effects

Simple audio wrapper for easy sound effects on your website. SFX.js plays OGG files when browser supports them, and falls back to MP3 otherwise. OGG is prioritized because it is an open format with developer friendly licensing, unlike MP3… If a browser support for OGG files will be ubiquitous, I’d like to drop support for MP3 in SFX.js.

SFX works in Chrome, Opera, Firefox, Safari (with issues), and IE9+ (haven’t tested other browsers). Supported file types are:

  • Chrome: OGG + MP3
  • Opera: OGG
  • Firefox: OGG
  • Safari: MP3
  • IE9: MP3