web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2024-12-25 02:42:10 +02:00
Code Releases Activity

Added setup.

Browse Source
This commit is contained in:
Steve Heffernan 2010-05-17 21:25:32 -07:00
parent 8dd017d892
commit a843541f6c
3 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
demo.html
View File

@ -3,17 +3,17 @@
<head>
<meta charset="utf-8" />
<title>HTML5 Video Player</title>
<link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
<script src="video.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
var bodyLoaded = function(){
videoPlayer = videoJSPlayers[0] = new VideoJS(document.getElementById("video"), 0);
VideoJS.setup();
}
</script>
<link rel="stylesheet" href="video-js.css" type="text/css" media="screen" title="Video JS" charset="utf-8">
</head>
<body id="body" onload="bodyLoaded();">
<body id="body" onload="bodyLoaded()">
<div class="video-box">
<!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->

10
video-js.css
View File

@ -4,7 +4,15 @@ body { background-color: #222; color: #fff; }
/* General controls styles */
.vjs-controls { display: none; list-style: none; margin: 0; padding: 0; position: absolute; height: 30px; opacity: 0.85; color: #fff; }
.vjs-controls > li { list-style: none; float: left; height: 25px; width: 25px; margin: 0 5px 0 0; padding: 0; background-color: #001E25; text-align: center; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.vjs-controls > li { list-style: none; float: left; height: 25px; width: 25px; margin: 0 5px 0 0; padding: 0; text-align: center;
background: #001E25; border-radius: 5px;
/* Webkit */
-webkit-border-radius: 5px;
background: -webkit-gradient(linear, left 10, left bottom, from(#001E25), to(#000));
/* Mozilla */
-moz-border-radius: 5px;
background: -moz-linear-gradient(top, #001E25, #000); /* for firefox 3.6+ */
}
.vjs-controls > li:last-child { margin-right: 0; }
.vjs-controls > li:first-child { margin-left: 5px; }

13
video.js
View File

@ -4,7 +4,7 @@
// Store a list of players on the page for reference by event listeners
var videoJSPlayers = new Array();
// Video JS Class
// Video JS Player Class
var VideoJS = Class.extend({
// Initialize the player for the supplied video tag element
@ -376,3 +376,14 @@ var VideoJS = Class.extend({
})
// Class Methods
// Add video-js to any video tag with the class
VideoJS.setup = function(){
var videoTags = document.getElementsByTagName("video");
for (var i=0;i<videoTags.length;i++) {
if (videoTags[i].className.indexOf("video-js") != -1) {
videoJSPlayers[i] = new VideoJS(document.getElementById("video"), i);
}
}
}