Skip to content

Instantly share code, notes, and snippets.

@cpoDesign

cpoDesign/video_player.html

Last active March 23, 2016 09:04
Show Gist options
  • Save cpoDesign/03e07836221fbd12e74c to your computer and use it in GitHub Desktop.
Save cpoDesign/03e07836221fbd12e74c to your computer and use it in GitHub Desktop.
Download ZIP
Example how to play video in html5
Raw
video_player.html
<html>
<body>
<video width="320" height="240" controls id="vieoEl" autoplay>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<button onclick="setVideoSource()" >Update videSource </button>
<script>
function setVideoSource(){
var video = document.getElementById('vieoEl');
document.querySelector("#vieoEl > source").src = "video2.mp4"
video.load();
}
</script>
</body>
</html>
Raw
video_player_withFallback.html
<html>
<body>
<video width="320" height="240" controls id="vieoEl" autoplay>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<button onclick="setVideoSource()" >Update videSource </button>
<script>
function setVideoSource(){
var video = document.getElementById('vieoEl');
document.querySelector("#vieoEl > source").src = "video2.mp4"
video.setAttribute("src", fullVideoUrl); // fallback if video does not update
video.load();
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment