Bootstrap video player

A customizable HTML5 video player plugin for jQuery based on bootstrap UI

Current version: 1.0
Tested in: jQuery 1.6+ in Firefox, Safari, Chrome, Internet Explorer 9, Opera 11.

Getting started

files to includes

 <link href="assets/bootstrap/css/bootstrap.min.css" rel="stylesheet">

<link href="assets/css/video-default.css" rel="stylesheet">

<script type="text/javascript" src="assets/js/jquery-1.8.1.min.js"></script>

<script type="text/javascript" src="assets/js/jquery.video-ui.js"></script>

HTML markup structure

 <div class="videoUiWrapper thumbnail">

  <video width="370" height="214"  id="demo1">

    <source src="pathtovideo/video.ogv" type="video/ogg"> 

    <source src="pathtovideo/video.mp4" type="video/mp4">

    Your browser does not support the video tag.

  </video>

</div>

Default setup Bootstrap video player

$('#demo1').videoUI();

Setup with some option

 $('#demo1').videoUI({

  'autoHide':false,

  'volumeMedia': 1

});

Default setup demo

Settings

Property	Default	Description
playMedia	true	show pause/play button
progressMedia	true	show progress bar
timerMedia	true	show video timer
volumeMedia	5	show & set volume value 1..10
fullscreenMedia	true	enable full screen button
autoHide	true	enable auto hide control bar
autoPlay	false	enable auto play