Best jQuery Html5 Video Player Plugins & Tutorials with Demo

    Simple Instagram VIDEO with jQuery & HTML5

    June 26, 2013 | HTML5, Other API, Plugins, Premium, Video & Audio
    Simple Instagram VIDEO with jQuery & HTML5

    Simple Instagram Video is a premium Instagram plugin that uses the power of HTML5 Video to showcase the latest functionality of the Instagram API. We know you will love it as much as we do because we’ve designed it to be as beautiful as it is useful. Give it a try, have some fun, and share you moments with the world!

    Features:

    • Superior Codebase – Built on our amazingly bulletproof framework
    • Responsive Design – Fully mobile-ready design adapts to any device.
    • Fullscreen Video – Enjoy your videos fully regardless of the device.
    • Advanced Video Thumbnail Gallery Mode – Share your best Instagram videos with our clean thumbnail gallery.
    • Premium Video Playlist Gallery Mode – Display your videos with our unique playlist style video player.
    • Popular Instagram Feed Mode – This feed mode pulls in the photos from the Instagram popular feed.
    • Tag Instagram Feed Mode – This feed mode allows you to specify a tag to search from the Instagram API.
    • User Instagram Feed Mode – This feed mode allows you to specify a user id to pull in photos from a specific user.
    • Multiuser Instagram Feed Mode – This feed mode allows you to specify multiple user id’s to pull in photos from specific users. Note, this feature does NOT allow load more functionality.
    • Liked Instagram Feed Mode – Display photos and videos that you’ve liked all accross the Instagram API.
    Read More Demo

    StarTube : YouTube Video Gallery Powered by jQuery

    June 17, 2013 | Gallery, Plugins, Premium, Video & Audio
    StarTube : YouTube Video Gallery Powered by jQuery

    StarTube is a powerful yet easy to use video gallery based on the brand new StarTube jQuery Plugin. It’s a perfect choice if you wish to bring your favorite videos from YouTube to your website and display them nicely inside a categorized gallery. Developed in best practises of HTML5, CSS3, and Javascript.

    Features:

    • A responsive design that looks great on desktops, tablets and smart phones
    • Add unlimited number of videos to the gallery
    • Optionally group videos by categories
    • Assign videos to multiple categories to best match your gallery structure
    • Navigate using the keyboard as well as the on-page controls
    • Set custom player width value for best responsive performance on all devices
    • Set the number of thumbnails to show per page in the navigation panel
    • Set the video quality for the YouTube player
    • Enable or disable continuous video loop
    • Lite and dark color schemes available to switch between for smooth design integrations
    Read More Demo

    Custom CSS3 Video Players With HTML5 and jQuery

    March 8, 2013 | CSS2 / CSS3.0, HTML5, Video & Audio
    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.

    Read More Demo

    How to Create an Video Player in jQuery, HTML5 & CSS3

    June 28, 2012 | CSS2 / CSS3.0, HTML5, Video & Audio
    How to Create an Video Player in jQuery, HTML5 & CSS3

    In this tutorial we will code an Video Player from Impressionist UI by Vladimir Kudinov. We will code it with CSS3 for the styling and the “MediaElement.js” for the functionality. MediaElement.js is a HTML5 audio and video player that also works for older browsers using Flash and Silverlight to mimic the HTML5 MediaElement API.

    Read More Demo

    Custom HTML5 video player with jQuery and CSS3

    May 19, 2012 | CSS2 / CSS3.0, HTML5, SVG Tutorial, Video & Audio
    Custom HTML5 video player with jQuery and CSS3

    We want to create a video player that looks consistent across browsers. Each browser however provides its own different look and feel for the player, from the minimal approach of Firefox and Chrome, to the more shiny controls of Opera and Safari (see Figure 1 for the controls in each browser). If we want our controls to look the same across all browsers, and integrate with our own design, we’ll have to create our own controls from scratch.

    All media elements in HTML5 support the media elements API, which we can access using JavaScript and use to easily wire up functions such as play, pause, etc. to any buttons we create. Because the native video player plays nicely with other open web technologies, we can create our controls using HTML, CSS, SVG or whatever else we like.

    Read More Demo

    jQuery YouTube Popup Player Plugin

    May 14, 2012 | Plugins, Popup Window, Video & Audio
    jQuery YouTube Popup Player Plugin

    This is an easy to use jQuery Plugin to embed YouTube videos on your page by displaying them in a popup dialog box. I have used jQuery UI Dialog Widget as the popup container instead of reinventing the wheel. jQuery UI Dialog is a robust cross-browser mechanism to display a popup dialog box with title bar including a movable box with modal behavior.

    This is plugin is very simple to configure and use. YouTube Video Id can be stored in any attribute of the DOM element. This plugin keeps track of all the assigned popup events and won’t assign the click event if there already exists one, that way you can reassign the event for dynamically added HTML elements without affecting the existing ones.

    Read More Demo

    Native Fullscreen jQuery API

    May 11, 2012 | Video & Audio, Web
    Native Fullscreen jQuery API

    HTML5 <video> is great, but when it was first released, one of the big complaints was that it couldn’t do true FullScreen like Flash. Thankfully, this is changing and native FullScreen support is coming to most browsers in the next few months.

    The API is still heavily in flux especially since the W3C joined in this week. I spent some time working through the differences to implement FullScreen in MediaElement.js HTML5 video player, and it’s working great in Safari 5.1+, Chrome Canary Chrome 15+, or Firefox Nightly (go to about:config and set full-screen-api.enabled= true) and scheduled for Firefox 10.

    Read More Demo

    Javascript Driven HTML5 Video Player: Dplayer

    January 25, 2012 | Core Java Script, HTML5, Video & Audio
    Javascript Driven HTML5 Video Player: Dplayer

    Dplayer is an open source, easily extend-able, HTML5 video player that allows users to easily embed videos in any page, blog or site using the newest web standards. It mainly makes use of HTML, CSS and JS while featuring as less Adobe Flash as possible (just for fallback) to allow customization with a minimal effort.No browser plugin, no Flash dependencies! You can jump anywhere in the video without waiting while buffering.

    Read More Demo

    Cuepoint JS a jQuery plugin for HTML5 video subtitle

    December 1, 2011 | HTML5, Plugins
    Cuepoint JS a jQuery plugin for HTML5 video subtitle

    Cuepoint.js is an open source plugin for adding up cue-points and subtitles to your HTML5 video.

    Read More Demo

    jquery.videoBG – Make an HTML5 video a background

    October 12, 2011 | Animation, HTML5, Plugins
    jquery.videoBG – Make an HTML5 video a background

    videoBG is a jQuery plugin that allows you to very easily use an HTML5 video as a background to a website or any div. For browsers that don’t support the HTML5 video tag, it will simplu use an image.
    Bear in mind bandwidth usage for both you, and your visitors. Also don’t use it too often, too many video instances will slow down the browser.

    Read More Demo