html5-videomediaelement.jssubtitle

MediaElment.js : How to change the source files of subtitles (track element) on the fly?

How to change the source files of subtitles on the fly (originally defined in the HTML via <track> element) when changing a video source (via the setSrc() method) ?

In other words, when playing a video I use setSrc() method to change video source and I would also redefine the subtitle files (SRT) linked.

Solution

  • A trick I devised was to set an ID on the subtitle track

    <track id="subtitles" kind="subtitles" src="subtitles.srt" srclang="en" />

    Then inside of whatever event you need you can use:

    $('#subtitles').attr('src', 'different_subtitles.srt');
player.findTracks();
player.loadTrack(0);
player.setSrc('different_video.mp4');

    There may be a more elegant way to go about this and MediaElementJS really should provide an API for this. But in the meantime this trick should get you by.