HTML5 video视频track加载WebVtt字幕实例页面

回到相关文章 »

效果:

代码:

HTML代码:
<video id="video" width="180" height="314" autoplay autobuffer>
    <source src="./sing-song.mp4" type="video/mp4">
    <track src="./sing-song.vtt" kind="subtitles" label="中文字幕" srclang="zh" default>
</video>
                
sing-song.vtt代码:
WEBVTT

00:00:00.001 --> 00:00:01.000
请把你的锅

00:00:01.001 --> 00:00:03.500
带回你的虾

00:00:03.501 --> 00:00:07.000
请把你的微笑留下……

00:00:07.501 --> 00:00:10.000
请把你的锅

00:00:10.001 --> 00:00:12.000
带回你的虾

00:00:12.001 --> 00:00:15.000
请把你的微笑留下