Skip to content

Commit 03aa2b4

Browse files
committed
Update example
1 parent 282520b commit 03aa2b4

2 files changed

Lines changed: 11 additions & 7 deletions

File tree

README.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,11 @@ Please report any issues or feature requests on the tracker. Thank you!
1111
Once you've added the plugin script to your page, you can use it with any video:
1212

1313
```html
14+
<head>
1415
<script src="video.js"></script>
1516
<script src="videojs-transcript.js"></script>
17+
</head>
18+
<body>
1619
<video id="video">
1720
<source src="whatever.webm" type="video/webm">
1821
<track kind="captions" src="mycaptions.srt" srclang="en" label="English" default>
@@ -34,8 +37,9 @@ Once you've added the plugin script to your page, you can use it with any video:
3437
var transcriptContainer = document.querySelector('#transcript');
3538
transcriptContainer.appendChild(transcript.el());
3639
</script>
40+
</body>
3741
```
38-
There's also a [working example](example.html) of the plugin you can check out if you're having trouble.
42+
There's also a [working example](https://walsh9.github.io/videojs-transcript/example.html) of the plugin you can check out if you're having trouble.
3943

4044
You'll also want to include one of the css files.
4145
You can style the plugin as you like but there are a few examples in the /css folder to get you started.

example.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,10 @@
2323
margin: 40px auto;
2424
}
2525
</style>
26-
</head>
27-
<body>
26+
<script src="node_modules/video.js/dist/video-js/video.js"></script>
27+
<script src="dist/videojs-transcript.js"></script>
28+
</head>
29+
<body>
2830
<div class="info">
2931
<p>
3032
You can see the Video.js Transcript plugin in action below.
@@ -40,8 +42,8 @@
4042
<p>
4143
Your browser doesn't support video. Please <a href="http://browsehappy.com/">upgrade your browser</a> to see the example.
4244
</p>
43-
<source src="http://www.openbeelden.nl/files/92/104101.ed_hd.mp4" type="video/mp4">
44-
<source src="http://www.openbeelden.nl/files/92/104105.ed_hd.webm" type="video/webm">
45+
<source src="//www.openbeelden.nl/files/92/104101.ed_hd.mp4" type="video/mp4">
46+
<source src="//www.openbeelden.nl/files/92/104105.ed_hd.webm" type="video/webm">
4547
<track kind="captions" src="captions/captions.en.srt" srclang="en" label="English" default>
4648
<track kind="captions" src="captions/captions.sv.srt" srclang="sv" label="Swedish">
4749
<track kind="captions" src="captions/captions.ru.srt" srclang="ru" label="Russian">
@@ -50,8 +52,6 @@
5052
</video>
5153
<div id="transcript"></div>
5254
</div>
53-
<script src="node_modules/video.js/dist/video-js/video.js"></script>
54-
<script src="dist/videojs-transcript.js"></script>
5555
<script>
5656
var video = videojs('video');
5757

0 commit comments

Comments
 (0)