Subtitle Demo

1. Subtitle Demo

2. Sample Code

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" charset="utf-8" src="https://cdn.zwplayer.com/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.com/media/VMAP9lxJvRpgn5sP3lV6rQ9qkzQmh5psggtFawR3lNR7hQ2_kore.srt';
            var subtitleURL_japan = 'https://cdn.zwplayer.com/media/VMAP9lxJvRpgn5sP3lV6rQ9qkzQmh5psggtFawR3lNR7hQ2_jpan.srt';
            player1.addSubtitle(subtitleURL_korean, '1');
            player1.addSubtitle(subtitleURL_japan, '2');
        }
    }

    var info = {
        playerElm: 'mse',
        autoplay: false,
        fluid: true,
        ratio: "16:9",
        url: 'https://cdn.zwplayer.com/media/VMAP9lxJvRpgn5sP3lV6rQ9qkzQmh5psggso3185.mp4'
    };

    var player1 = new ZWPlayer(info);
    //延时加载
    setTimeout(onLoadSubtitle, 200);
</script>

</body>
</html>

3. Notes

It is recommended to load subtitles after the video has finished loading to ensure the best user experience.
Subtitle track identifiers (‘1’, ‘2’) are used to distinguish the display positions for dual subtitles.
The subtitle control panel allows you to select dual subtitles or a single subtitle.