Subtitle Settings

1. Subtitle Demo

2. Example Code

<!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);
    // Delayed loading
    setTimeout(onLoadSubtitle, 200);
</script>

</body>
</html>

3. Notes

  1. It is recommended to load subtitles after the video has finished loading to ensure the best user experience

  2. Subtitle track identifiers ('1', '2') are used to distinguish the display positions of dual subtitles

  3. The subtitle control panel allows selecting dual subtitles or a single subtitle

Catalog Navigation