Undertekster med javascript
Undertekster til audio
Indtil track bliver understøttet i alle browsere, er der en alternativ mulighed for at lave undertekster til en video. Men selv om javascriptet virker i alle versioner af (x)html, er du af hensyn til elementet video alligevel nødt til at lave det i html5
<div id="afspiller2">
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="jquery.srt.js"></script>
<audio controls="controls">
<source src="images/lollipop.ogg" type="audio/ogg">
<source src="images/lollipop.mp3" type="audio/mpeg">
<source src="images/lollipop.wav" type="audio/wave">
</audio>
<script type="text/javascript" src="undertekster.js"></script>
<div id="undertekst1" class="srt" data-video="videoafspiller1" data-srt="images/lollipop.srt"></div>
</div>
.afspiller {
height: 100px;
}
#undertekst2 {
color: #fff;
background-color: #333;
padding: 0 5px 0 5px;
}
Vil se sådan ud i din browser - ved at lægge det hele i en div med fast højde undgås det at den efterfølgende del af siden vil hoppe op og ned:
Hent de anvente javascripts - der skal ikke ændres noget i dem:
Kildefilen til en .srt subtitle-fil adskiller sig kun meget lidt fra en .vtt-fil:
1a
00:00:00,500 --> 00:00:02,500
My boy Lollipop
2
00:00:04,600 --> 00:00:08,000
you made my heart go giddy up
3
00:00:08,000 --> 00:00:11,500
You are as sweet as candy,
Læg mærke til, at .srt ikke indledes med en WEBSRT FILE og at der bruges komma i stedet for punktum før sekund-decimalerne! I øvrigt er tidsformateringen den samme som ved .vtt
Det er vigtigt, at du gemmer filen undertekst.srt i tegnkodning utf-8, da det ellers ikke virker.
