Tag Archives: videojs

VideoJS m3u8 example

Here is an example of how to use video.js with HTTP Live Streaming (HLS) with an m3u8 playlist file: < !doctype html> <html> <head> <link rel=”nofollow” href=”http://vjs.zencdn.net/c/video-js.css” rel=”stylesheet”/> <script src=”http://vjs.zencdn.net/c/video.js”></script> </head> <body> <video id=”my_video_1″ class=”video-js vjs-default-skin” controls preload=”auto” width=”640″ height=”264″ poster=”my_video_poster.png” data-setup=”{}”> <source src=”http://server.name.tld/HLS/path.m3u8″ type=’application/vnd.apple.mpegurl’/> </video> </body> </html> via

Posted in Web Development | Tagged , , , | 3 Comments

Using VideoJS with YouTube

I have been using VideoJS for some streaming videos and mp4 videos, but also wanted to pull YouTube videos into the player along with the other videos I had on the site. First of all, the working example. Then, the list of problems ;) VideoJS and Youtube Example How to replicate the Youtube and VideoJS integration: First, clone or download this fork of videoJS and build it. Next, place this in your webpage’s <head> (needs to be there to work with older browsers). Also fix the odd character after the href in the first line (sorry about that) and make sure the path points to the correct location for the files. <link href≠”/video-js/video-js.css” rel=”stylesheet” type=”text/css”/> <script src=”/video-js/video.js”></script> And then place this in your document’s <body>: <video id=”example_video_1″ class=”video-js vjs-default-skin” controls preload=”none” width=”640″ height=”360″ data-setup='{“techOrder”:[“youtube”,”html5″],”ytcontrols”:false}’> <source src=”http://www.youtube.com/watch?v=v1uyQZNg2vE” type=’video/youtube’ /> </video> There is also an example file in the dist directory which will only be created after you “build” the fork you have cloned from github. VideoJS and Youtube Problems With Integration I tried simply giving VideoJS the URL to the YouTube video but that didn’t workout so well. Here are a few things that might help you out with playing You Tube videos in Video JS: There is a pull request for changes that would allow VideoJS to work with YouTube. A few problems with it are: Has not been pulled in Both the Video JS maintainer and the pull requestor have become busy with other projects so it might not … Continue reading

Posted in Tech Tips, Web Development | Tagged , , , | 1 Comment