PragmaticPlayerJs – jQuery plugin for embedded youtube and HTML5 videos

We present a highly customizable jQuery video plugin, that make it easy to embed Youtube and HTML5 Videos into our web projects.

Play Youtube and HTML5 videos easy

jQuery video plugin
jQuery video plugin

PragmaticPlayerJs is easy-to-customize, responsive player for embedded Youtube or HTML5 videos.

This player has adapters for Youtube and HTML video APIs. So you can use it as customizable Youtube player or as HTML video player with fallback to Youtube player if the user browser doesn’t support HTML5 video element.

How to use

Just do simple steps as follows.

Include player script and CSS on the page

Youtube player:

<div id="youtube-video"><!-- --></div>

$("#youtube-video").pPlayer({
    youtubeVideoId: "YE7VzlLtp-4",
    autoplay: 0,
    origin: "http://yoursite.com"
});

HTML video player:

<div id="html5-video">
    <video poster="./assets/poster.jpg" preload="true">
        <!-- MP4 for Safari, IE9, iPhone, iPad, Android, and WP7 -->
        <source type="video/mp4" src="./assets/test.mp4" />
        <!-- Ogg/Vorbis for older Firefox and Opera versions -->
        <source type="video/ogg" src="./assets/test.ogv" />
    </video>
</div>
$("#html5-video").pPlayer({
    youtubeVideoId: "YE7VzlLtp-4" // Youtube fallback
});

Plugin options

youtubeVideoId – the YouTube video ID that identifies the video that the player will load

autoplay – values: 0 or 1, default 0

– hd – values: 0 or 1, default 1

– adapter – used to specify video API adapter explicitly, can be either VideoElement or Youtube

– features – a list of enabled features, by default it is [“playpause”, “progress”, “quality”, “timer”, “mute”, “fullscreen”]

More details @ GitHub project page:

https://github.com/dsheiko/PragmaticPlayerJs

Demo:

http://demo.dsheiko.com/pplayer

Enjoy!

Share:Share on Facebook1Share on Google+1Tweet about this on TwitterShare on LinkedIn1Pin on Pinterest1