HTML and CSS Reference
In-Depth Information
Captionator works by providing subtitles/captions using the file in whatever track element has
the default attribute. It supports both WebVTT and SRT formatted track files. Example 27
shows a complete page using the sintel_en.srtsubtitle file and Captionator to manage the sub-
Example27.Using Captionator with a SRT subtitle file
<!DOCTYPE html>
<title>Sintel with English Subtitles</title>
<meta charset="utf-8" />
<script src="js/captionator.js"></script>
window.addEventListener("load",function(eventData) {
<video controls poster="sintelposter.jpg" width="480" height="204">
<source src="sintel.m4v" type="video/mp4" />
<source src="sintel.webm" type="video/webm" />
<track label="English subtitles" kind="subtitles"
srclang="en" src="" default />
Calling the captionify method on the Captionator object not only turns on the subtitles, but
also creates a tracks property on the video element. Captionator also works with WebVTT,
including support for the WebVTT cues and formatting. An advantage to using the library is
that it can work with your own custom controls or the default control, as shown in Figure 24 .
Search WWH ::

Custom Search