Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Styling and positionning subtitles and captions</title>
  <style type="text/css">
        ::cue(.myclass) { color: red; }
        ::cue(v[voice="Tarzan"]) { color: blue; }
        ::cue(v[voice="Jane"]) { color: green; }
        ::cue(#bigtext) { font-size: 150%; }
  </style>
</head>
<body>
<video height="270" width="640" 
       poster="http://demo.jwplayer.com/html5-report/edream.jpg" 
       crossorigin="anonymous" controls>
  <source src="http://demo.jwplayer.com/html5-report/edream.mp4" type="video/mp4">
  <source src="http://demo.jwplayer.com/html5-report/edream.webm" 
          type="video/webm">
  <track src="http://demo.jwplayer.com/html5-report/edream-features.vtt" 
         kind="captions" label="VTT Features" default>
</video>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
micbuffapro
0viewers