Best jQuery Video & Audio Plugins & Tutorials with Demo

VexFlow : JavaScript library for Rendering Music Notation

VexFlow : JavaScript library for Rendering Music Notation

VexFlow is an open-source web-based music notation rendering API. It is written completely in JavaScript, and runs right in the browser. VexFlow supports HTML5 Canvas and SVG, and runs on all modern browsers.

Flow Gallery : jQuery HTML5 Multimedia Gallery

Flow Gallery : jQuery HTML5 Multimedia Gallery

Flow Gallery is a jQuery plugin based HTML5 multimedia gallery enabling you to showcase your photos/audio/video in a modern and sleek interface. You have the option of presenting your items in in either columns or rows type grid. Along with photos you can choose to display your own self-hosted audio/video files or videos from Youtube/Vimeo/Dailymotion. The gallery features a fully responsive design and can fit in any screen size ranging from mobile phones to desktop browsers. The gallery is also optimized for retina and touch screens and provides the feel of a native app.

jQuery Splash Screen Pro

jQuery Splash Screen Pro
  • Full-screen video and image backgrounds
  • Google Fonts support
  • Multiple screens support
  • YouTube & HTML5 videos
  • Launch a preview from the editor

Splash Screen Pro uses a 12-column grid system, similar to Bootstrap’s grid system.Everything in the editor is drag and drop. You can create columns and rows and reposition them however you like.

Web Slide : jQuery Off-Canvas Responsive Mega Menu

Web Slide : jQuery Off-Canvas Responsive Mega Menu

Off Canvas Menus are used primarily with Mobile and touch devices. It provides a modern application style navigation look in your website

  • We are combining website menu and mobile menu in one code
  • Mobile application drawer menu
  • Responsive Mega menu give you a freedom to put lots of links in your any type of website,
  • You can put Contact form in your website menu bar, it also works in mobile devices.
  • Using Jquery/CSS3 animations
  • You can select color and gradients
  • Scalable and light weight vector icons
  • Fully supported in desktop browser and mobile browser.

jQuery Video Sequence Plugin

jQuery Video Sequence Plugin

jQuery plugin for creating video and audio sequences with media source extensions.

jQuery Youtube Channels Playlist

jQuery Youtube Channels Playlist

jQuery youtube channels playlist has a following features:

  • You can customize width and height of the widget on your website.
  • The widget itself is responsive; given a width (or %) for the widget, the inner contents will resize accordingly.
  • A top featured video can be opened in the video player on load of the widget.
  • Displays your actual complete youtube channel on your website just like its shown on youtube.

Youmax – YouTube Channel on your Website

Youmax - YouTube Channel on your Website

Youmax 3.0 is a jQuery plugin used to display any youtube channel feeds on your website.

Features:

  • Works on any device size (responsive + fluid)
  • Fancy Layout – uses Wookmark grid
  • Load More button for playlist items
  • Improved lightbox popup for videos – uses Magnific Popup for Videos
  • Optimized code package (minified JS+CSS ~ 40KB)
  • Uses YouTube v3.0 API
  • Customize anything with CSS

jQuery Video Background plugin

jQuery Video Background plugin

HTML5 video background jQuery plugin.Will place a resizable video in to the background of the page or designated element. Browsers that don’t support the HTML5 video element will get an image if a poster image was provided.

If the containing element’s width and height does not match the aspect ration of the video, the video will not stretch to fill the container but will render based on the largest dimension.

okvideo : jQuery Fullscreen background Videos Plugin

okvideo : jQuery Fullscreen background Videos Plugin

OKVideo is a jQuery plugin that allows for YouTube or Vimeo videos to be used as full-screen backgrounds on webpages. OKVideo aims to be customizable while making some basic decisions about how the plugin should control video. When using OKVideo, all videos will be served from Vimeo or YouTube based on a number of variables like browser, device, bandwidth, etc.

Magneticmediajs : JavaScript Solution To Nicely Display Media Content

Magneticmediajs : JavaScript Solution To Nicely Display Media Content

Magneticmediajs is a JavaScript solution to display media in a stylish mobile-ready overlay fashion. It also lets you ingest content from today’s most popular media platform: Youtube, Instagram, Vimeo, Flickr, Dailymotion.

Magneticmediajs is built with a JavaScript class model for easier work of extension, jQuery for DOM manipulation and Less CSS3 with progressive enhancement. It supports various touch events, including swipes between media items, and scales well from mobile devices (iOS, Android …) to large computer screens. Plus it has some super cool design effects for images including a magnifying glass and 8 filters (sepia, grayscale, saturate …).