Skip to content

lusaisai/jplayer-bootstrap-skin

Repository files navigation

I see there're not many jplayer skins on the web, so I created this one simply using bootstrap css and adding a little javascript. It looks like follows,

screenshot

Usage

It depends on BootStrap, make sure it is already included, then include the js and css file in your page.

    <link href="jplayer-bootstrap.css" rel="stylesheet">

JPlayer does not have buffer status showing, you can include the following javascript to show it.

    <script type="text/javascript" src="jplayer-buffer.js"></script>

In your javascript code, construct an object with the jplayer id, then run the buffer method which will return a function object, bind this object to both timeupdate and progress event. See example.html for details.

	var buffer = new JPlayerBuffer('jquery_jplayer_1').buffer();
    ...
    timeupdate: buffer,
    progress: buffer
    ...