Skip to content

Instantly share code, notes, and snippets.

@sbalay

sbalay/index.html

Created June 19, 2017 05:10
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save sbalay/e080f885d2089be402221d092bd0685b to your computer and use it in GitHub Desktop.
Save sbalay/e080f885d2089be402221d092bd0685b to your computer and use it in GitHub Desktop.
Download ZIP
Videojs hls example
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>videojs-contrib-hls embed</title>
<!--
Uses the latest versions of video.js and videojs-contrib-hls.
To use specific versions, please change the URLs to the form:
<link href="https://unpkg.com/video.js@5.16.0/dist/video-js.css" rel="stylesheet">
<script src="https://unpkg.com/video.js@5.16.0/dist/video.js"></script>
<script src="https://unpkg.com/videojs-contrib-hls@4.1.1/dist/videojs-contrib-hls.js"></script>
-->
<link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
<script src="https://unpkg.com/video.js/dist/video.js"></script>
<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>
</head>
<body>
<h1>Video.js Example Embed</h1>
<video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268"
data-setup='{}'>
</video>
<script>
const player = videojs('my_video_1');
player.src({
src: 'http://d2zihajmogu5jn.cloudfront.net/bipbop-advanced/bipbop_16x9_variant.m3u8',
type: 'application/x-mpegURL'
});
</script>
</body>
</html>
@suwat-netprom
Copy link

not work ie 11 os win7

@andarm
Copy link

andarm commented Jul 23, 2018

  • How to set fast forward? (when playing, the progress bar disappear)
  • How to make replay?

@adimoraret
Copy link

Not working in Chromium 75.0.3762.0

@saharcohen27
Copy link

Thanks! helped me a lot!

@ZiTAL
Copy link

ZiTAL commented Apr 27, 2023 •
edited

it's not working with that JS versions, but the code works fine, doesn't matter the "video" tags has type="application/x-mpegURL", it's important to set it via "src" method, thank you :)

here my gist and jsfiddle:
https://gist.github.com/ZiTAL/434338d6d5cf9abdd47211f3e980aaa4

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