2010-05-19 03:23:19 +03:00
<!DOCTYPE html>
< html >
2010-05-14 21:49:06 +03:00
< head >
2010-05-19 03:23:19 +03:00
< meta charset = "utf-8" / >
2010-05-27 22:42:06 +03:00
< title > HTML5 Video Player | Video JS< / title >
2010-05-22 05:57:03 +03:00
< meta name = "google-site-verification" content = "QHf9MEYVlEWoNHbzTeUkSQsbRT5Twzqu6N0nX1i3nes" / >
2010-05-19 03:23:19 +03:00
< script src = "video-js/video.js" type = "text/javascript" charset = "utf-8" > < / script >
2010-05-28 19:42:42 +03:00
<!-- JQuery not required, but used for dom ready function -->
< script src = "javascripts/jquery-1.4.2.min.js" type = "text/javascript" charset = "utf-8" > < / script >
2010-05-19 03:23:19 +03:00
< link rel = "stylesheet" href = "stylesheets/base.css" type = "text/css" media = "all" charset = "utf-8" / >
< link rel = "stylesheet" href = "video-js/video-js.css" type = "text/css" media = "all" charset = "utf-8" / >
< link rel = "stylesheet" href = "stylesheets/site.css" type = "text/css" media = "all" charset = "utf-8" / >
<!-- [if !IE 7]>
< style type = "text/css" >
#wrap {display:table;height:100%}
< / style >
<![endif]-->
2010-05-19 03:27:41 +03:00
2010-05-21 19:57:09 +03:00
< script type = "text/javascript" charset = "utf-8" >
2010-08-20 07:40:59 +03:00
VideoJS.setupAllWhenReady();
// See demo.html for other setup options
2010-06-03 08:08:04 +03:00
2010-05-21 19:57:09 +03:00
< / script >
2010-05-14 21:49:06 +03:00
< / head >
2010-05-21 19:57:09 +03:00
< body >
2010-05-14 21:49:06 +03:00
2010-05-19 03:23:19 +03:00
< div id = "wrap" >
< div id = "main" >
2010-05-19 03:27:41 +03:00
2010-05-19 03:23:19 +03:00
< ul id = "nav" >
2017-05-18 23:41:25 +02:00
< li > < a href = "skins.html" > Skins< / a > < / li >
2010-05-19 03:23:19 +03:00
< li > < a href = "http://github.com/zencoder/video-js" > Source< / a > < / li >
2010-06-04 04:55:26 +03:00
< li > < a href = "http://wiki.github.com/zencoder/video-js/browser-device-compatibility" > Compatibility< / a > < / li >
2010-05-19 03:23:19 +03:00
< li > < a href = "http://github.com/zencoder/video-js/issues" > Issue Tracker< / a > < / li >
< li > < a href = "http://wiki.github.com/zencoder/video-js/" > Wiki< / a > < / li >
< / ul >
2010-05-19 03:27:41 +03:00
2010-05-19 03:23:19 +03:00
< h1 > Video JS< / h1 >
< p class = "tagline" > Open Source HTML5 Video Player< / p >
2010-05-19 03:27:41 +03:00
2010-06-03 08:08:04 +03:00
<!-- Begin VideoJS -->
2010-05-21 19:50:51 +03:00
< div class = "video-js-box" >
2010-06-03 08:08:04 +03:00
<!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
2017-05-18 23:38:09 +02:00
< video class = "video-js" width = "640" height = "264" poster = "//vjs.zencdn.net/v/oceans.png" controls preload >
< source src = "//vjs.zencdn.net/v/oceans.mp4" type = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"' >
< source src = "//vjs.zencdn.net/v/oceans.webm" type = 'video/webm; codecs="vp8, vorbis"' >
< source src = "//vjs.zencdn.net/v/oceans.ogg" type = 'video/ogg; codecs="theora, vorbis"' >
2010-06-15 19:33:27 +03:00
< object class = "vjs-flash-fallback" width = "640" height = "264" type = "application/x-shockwave-flash"
2010-05-19 03:23:19 +03:00
data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf">
< param name = "movie" value = "http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" / >
< param name = "allowfullscreen" value = "true" / >
2017-05-18 23:38:09 +02:00
< param name = "flashvars" value = 'config={"clip":{"url":"//vjs.zencdn.net/v/oceans.mp4","autoPlay":false,"autoBuffering":true}}' / >
< img src = "//vjs.zencdn.net/v/oceans.png" width = "640" height = "264" alt = "Poster Image"
2010-06-03 08:08:04 +03:00
title="No video playback capabilities." />
2010-05-19 03:23:19 +03:00
< / object >
< / video >
2010-06-03 08:08:04 +03:00
< p class = "vjs-no-video" > < strong > Download Video:< / strong >
2017-05-18 23:38:09 +02:00
< a href = "//vjs.zencdn.net/v/oceans.mp4" > MP4< / a > ,
< a href = "//vjs.zencdn.net/v/oceans.webm" > WebM< / a > ,
< a href = "//vjs.zencdn.net/v/oceans.ogg" > Ogg< / a > < br >
2010-06-03 08:08:04 +03:00
< a href = "http://videojs.com" > HTML5 Video Player< / a > by < a href = "http://videojs.com" > VideoJS< / a >
< / p >
2010-05-19 03:23:19 +03:00
< / div >
2010-06-03 08:08:04 +03:00
<!-- End VideoJS -->
2010-05-21 19:50:51 +03:00
2010-05-19 03:23:19 +03:00
< p id = "video_note" > Video clip is from < a href = "http://disney.go.com/disneynature/oceans/" title = "Oceans" > Disney’ s Oceans< / a > < / p >
2010-05-19 03:27:41 +03:00
2010-05-20 01:03:12 +03:00
< p > Video JS is a javascript-based video player that uses the HTML5 video functionality built into advanced browsers. In general, the benefit of using an HTML5 player is a consistent look between browsers.< / p >
2010-05-19 03:27:41 +03:00
2010-05-28 02:02:15 +03:00
< p id = "sponsor" >
2010-05-28 02:28:23 +03:00
< a href = "http://zencoder.com" > Video encoding & hosting< / a > provided by:< br >
2010-05-28 02:02:15 +03:00
< a href = "http://zencoder.com" > < img src = "images/zencoder-logo.png" border = "0" alt = "Zencoder - Video Encoding" > < / a >
< / p >
2010-05-19 03:27:41 +03:00
< div id = "features_and_support" class = "clearfix" >
< div id = "features" >
2010-05-19 03:23:19 +03:00
< h6 > Features< / h6 >
< ul id = "feature_list" >
< li > Free & Open Source< / li >
< li > Lightweight. < strong > NO IMAGES USED< / strong > < / li >
< li > 100% skinnable using CSS< / li >
2010-05-22 21:17:16 +03:00
< li > Library independent< / li >
2010-05-19 03:23:19 +03:00
< li > Easy to use< / li >
< li > Easy to understand & extend< / li >
< li > Consistent look between browsers< / li >
< li > Full Window Mode< / li >
< li > Volume Control< / li >
2010-06-15 19:56:53 +03:00
< li > Forced fallback to Flash (even when there is an unsupported source)< / li >
2010-05-19 03:23:19 +03:00
< li > < / li >
< / ul >
< / div >
< div id = "supported" class = "clearfix" >
< h6 > Download< / h6 >
< div class = "supported-section" >
< a href = "http://github.com/zencoder/video-js/zipball/master" title = "Zip Download" > < img src = "images/icons/zip.png" alt = "Zip Download" > < / a >
< a href = "http://github.com/zencoder/video-js/tarball/master" title = "Tar Download" > < img src = "images/icons/tar.png" alt = "Tar Download" > < / a >
< / div >
< h6 > Supported Browsers< / h6 >
< div class = "supported-section" >
< a href = "http://www.mozilla.com/en-US/firefox/firefox.html" title = "Firefox" > < img src = "images/icons/firefox.png" alt = "Firefox" > < / a >
< a href = "http://www.apple.com/safari/" title = "Safari" > < img src = "images/icons/safari.png" alt = "Safari" > < / a >
< a href = "http://www.google.com/chrome" title = "Chrome" > < img src = "images/icons/chrome.png" alt = "Chrome" > < / a >
2010-05-28 01:24:37 +03:00
< a href = "http://www.opera.com/" title = "Opera" > < img src = "images/icons/opera.png" alt = "Opera" > < / a >
2010-05-19 03:23:19 +03:00
< / div >
< h6 > Fallback Support For< / h6 >
< div class = "supported-section" >
< a href = "http://www.microsoft.com/windows/Internet-explorer/default.aspx" title = "IE" > < img src = "images/icons/ie.png" alt = "IE" > < / a >
< / div >
< h6 > Supported Formats< / h6 >
< div class = "supported-section" >
< a href = "http://en.wikipedia.org/wiki/H.264/MPEG-4_AVC" title = "h264" > < img src = "images/icons/h264.png" alt = "h264" > < / a >
< a href = "http://www.theora.org/" title = "Ogg" > < img src = "images/icons/ogg.png" alt = "Ogg" > < / a >
< a href = "http://www.webmproject.org/" title = "WebM" > < img src = "images/icons/webm.png" alt = "WebM" > < / a >
< / div >
< h6 > Compatible With< / h6 >
< div class = "supported-section" >
< a href = "http://www.apple.com/iphone/" title = "iPhone" > < img src = "images/icons/iphone.png" alt = "iPhone" > < / a >
< a href = "http://www.apple.com/ipad/" title = "iPad" > < img src = "images/icons/ipad.png" alt = "iPad" > < / a >
< / div >
< / div >
2010-05-19 03:27:41 +03:00
2010-06-04 04:55:26 +03:00
< p id = "issues_link" > Submit any bugs in the < a href = "http://github.com/zencoder/video-js/issues" > Issue Tracker< / a > or update the < a href = "http://wiki.github.com/zencoder/video-js/browser-device-compatibility" > Compatibility Table< / a > < / p >
2017-05-18 23:43:22 +02:00
< p > Moved < a href = "comments.html" > comments< / a > to another page temporarily.< / p >
2010-06-09 11:51:25 +03:00
2010-06-09 11:45:06 +03:00
<!-- <div id="disqus_thread"></div>
2010-05-19 03:23:19 +03:00
< script type = "text/javascript" >
/**
2010-05-19 03:27:41 +03:00
* var disqus_identifier; [Optional but recommended: Define a unique identifier (e.g. post id or slug) for this thread]
2010-05-19 03:23:19 +03:00
*/
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://videojs.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
< / script >
< noscript > Please enable JavaScript to view the < a href = "http://disqus.com/?ref_noscript=videojs" > comments powered by Disqus.< / a > < / noscript >
2010-06-09 11:41:52 +03:00
< a href = "http://disqus.com" class = "dsq-brlink" > comments powered by < span class = "logo-disqus" > Disqus< / span > < / a > -->
2010-05-19 03:27:41 +03:00
2010-05-19 03:23:19 +03:00
< / div >
< / div >
< div id = "footer" >
2017-05-18 23:41:25 +02:00
© < a href = "//videojs.github.io/video.js" > The Video JS Project< / a > . Sponsored by < a href = "http://zencoder.com" > Zencoder< / a > .
2010-05-19 03:23:19 +03:00
< / div >
< / div >
2010-05-19 03:27:41 +03:00
2010-06-09 11:48:02 +03:00
<!-- <script type="text/javascript">
2010-05-19 03:23:19 +03:00
//< ![CDATA[
(function() {
2010-05-22 05:47:50 +03:00
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length ; i + + ) {
if(links[i].href.indexOf('#disqus_thread') >= 0) {
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('< script charset = "utf-8" type = "text/javascript" src = "http://disqus.com/forums/videojs/get_num_replies.js' + query + '" > < / ' + ' s c r i p t > ' ) ;
2010-05-19 03:23:19 +03:00
})();
//]]>
2010-06-09 11:48:02 +03:00
< / script > -->
2010-05-19 03:27:41 +03:00
2010-05-19 22:05:29 +03:00
< script type = "text/javascript" >
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-16505296-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
< / script >
2010-05-14 21:49:06 +03:00
< / body >
< / html >