html5video()

a jQuery plugin to easily control & customize your HTML5 video player


Usage

HTML markup structure

<video width="370" height="214" id="demo1">
   <source src="assets/video/demo.ogv" type="video/ogg">
   <source src="assets/video/demo.webm" type="video/webm">
   <source src="assets/video/demo.mp4" type="video/mp4">
   Your browser does not support the video tag.
</video>

javascript

$("#demo1").html5video({
   controls : false,
   autoplay : false,
   playSelector : $('#play'),
   pauseSelector : $('#pause'),
   stopSelector : $('#stop'),
   fullSelector : $('#fullScreen'),
   timerSelector : $('#timer'),
   durationSelector : $('#duration'),
   barSelector : $('#bar')
});

Settings

Property Default Description
controls false show / hide video controls
autoplay false Sets video should start playing as soon as it is loaded
playSelector null jQuery selector trigger playing video
pauseSelector null jQuery selector trigger pausing video
stopSelector null jQuery selector trigger stoping video
fullSelector null jQuery selector trigger full screen mode
timerSelector null jQuery selector current time container
durationSelector null jQuery selector video duration container
barSelector null jQuery selector progress bar container
volume 0.5 set volume

Methods

gotoAndPlay

('#demo1').html5video('gotoAndPlay',10);

gotoAndStop

('#demo1').html5video('gotoAndStop',10);

setVolume

('#demo1').html5video('setVolume',0.4);





/