Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Select an option

  • Save jack2jm/06e5e0013288ecb266f9e34003af4da9 to your computer and use it in GitHub Desktop.

Select an option

Save jack2jm/06e5e0013288ecb266f9e34003af4da9 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="https://cdn.plyr.io/3.6.3/plyr.css" />
</head>
<body>
<!--Add a Simple HTML5 Video tag-->
<div id="container">
<video
controls
playsinline
data-poster="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.jpg"
id="player"
>
<!-- Video files -->
<source
src="your_video_url"
type="video/mp4"
size="576"
/>
<source
src="your_video_url"
type="video/mp4"
size="720"
/>
<source
src="your_video_url"
type="video/mp4"
size="1080"
/>
<!-- Caption files -->
<track
kind="captions"
label="English"
srclang="en"
src="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.en.vtt"
default
/>
<track
kind="captions"
label="Français"
srclang="fr"
src="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.fr.vtt"
/>
<!-- Fallback for browsers that don't support the <video> element -->
<a href="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-576p.mp4" download>Download</a>
</video>
</div>
HTML
<script src="https://cdn.plyr.io/3.6.3/demo.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment