字幕设置
1. 字幕演示
2. 示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" charset="utf-8" src="https://cdn.zwplayer.cn/v3/zwplayer/zwplayer.js"></script>
</head>
<body>
<div id="mse" style="width: 800px; height: 450px; margin: 0 auto;"></div>
<script type="text/javascript">
function onLoadSubtitle() {
if (player1) {
var subtitleURL_korean = 'https://cdn.zwplayer.cn/media/VMAP9lxJvRpgn5sP3lV6rQ9qkzQmh5psggtFawR3lNR7hQ2_kore.srt';
var subtitleURL_japan = 'https://cdn.zwplayer.cn/media/VMAP9lxJvRpgn5sP3lV6rQ9qkzQmh5psggtFawR3lNR7hQ2_jpan.srt';
player1.addSubtitle(subtitleURL_korean, '1');
player1.addSubtitle(subtitleURL_japan, '2');
}
}
var info = {
playerElm: 'mse',
autoplay: false,
url: 'https://cdn.zwplayer.cn/media/VMAP9lxJvRpgn5sP3lV6rQ9qkzQmh5psggso3185.mp4'
};
var player1 = new ZWPlayer(info);
//延时加载
setTimeout(onLoadSubtitle, 200);
</script>
</body>
</html>3. 注意事项
建议在视频加载完成后再加载字幕,以确保最佳用户体验
字幕轨道标识('1'、'2')用于区分双字幕显示位置
字幕操作面板可选择双字幕或者某一单字幕
目录导航