Skip to content

Instantly share code, notes, and snippets.

@odev79
Last active June 19, 2018 22:44
Show Gist options
  • Save odev79/6f30981e24123ad7df3c to your computer and use it in GitHub Desktop.
Save odev79/6f30981e24123ad7df3c to your computer and use it in GitHub Desktop.
Video.js Example Embed - Reloaded
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="author" content="Oscar Estrada">
<meta name="viewport" content="width=device-width" />
<title>Video.js Example Embed</title>
<script src="http://vjs.zencdn.net/5-unsafe/video.js"></script>
<link rel="stylesheet" href="https://vjs.zencdn.net/5-unsafe/video-js.css" type="text/css">
<script>
function lightsOff() {
restoreColor = document.body.style.backgroundColor;
var e = document.body;
e.style.backgroundColor = "black";
var t = document.getElementById("restofpage");
t.style.opacity = .25
}
function lightsOn() {
var e = document.body;
e.style.backgroundColor = restoreColor;
var t = document.getElementById("restofpage");
t.style.opacity = 1
}
function vjsdimmer() {
var e = document.getElementsByTagName("video")[0];
e.addEventListener("playing", lightsOff, !1), e.addEventListener("pause", lightsOn, !1), e.addEventListener("ended", lightsOn, !1)
}
var restoreColor;
</script>
</head>
<body onload="vjsdimmer()">
<div id="restofpage"></div>
<h1>Video.js Example Embed</h1>
<div class="video-container">
<video id="player" class="video-js vjs-default-skin vjs-big-play-centered" controls preload width="640" height="264"
poster="http://video-js.zencoder.com/oceans-clip.png" data-setup='{"fluid": true, "playbackRates": [0.5, 1, 2], "html5": {"nativeTextTracks": false}}'>
<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
<source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm">
<track kind="captions" src="http://www.videojs.com/vtt/captions.vtt" srclang="en" label="captions on" default>
</video>
</div>
</body>
</html>
@Syedwaheed
Copy link

Syedwaheed commented Oct 19, 2017

Hi there,
I m facing this error can you please help me out of this. Thanks
Failed to load http://www.videojs.com/vtt/captions.vtt: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment