VTT tracks play in IE but not Chrome or Safari
Using the following embed code the VTT captions display in IE 11 browser, but not in Chrome 43+ or in iOS. The page is on our intranet so I can't expose it but the embed code is below. The media server is external facing.
I have added VTT Text/VTT mime type on the media server which is serving both the wowza stream and is the webserver for the preview images/vtt files.
I'm using SMIL with physical files on the media server.
<div id="wrap" style="width:640px;height:360px;">
<div id="video" style="display:none; position:relative">
<div id="player">Loading the player...</div>
</div>
<script type="text/javascript">
var playerInstance = jwplayer('player');
playerInstance.setup({
autostart:false,
width:640,
height:360,
playlist: [{
sources: [
{file: "http://media.renlearn.com:1935/vod/_definst/smil:10538.smil/playlist.m3u8"}
]
,tracks: [
{file: "http://media.renlearn.com/content/media/Marketing/10538/10538_sko2016_en_caption.VTT",
label: "English",
kind: "captions"},
{file: "http://media.renlearn.com/content/media/Marketing/10538/10538_sko2016_es_caption.VTT",
label: "Spanish",
kind: "captions"}
]
}],
sources: [
{file: "http://media.renlearn.com:1935/vod/_definst/smil:10538.smil/jwplayer.smil"}
]
});
</script>
<div id="posterimage">
<a onClick="document.getElementById('posterimage').style.display = 'none'; document.getElementById('video').style.display = 'block'; playerInstance.play();" href="#" > <img src="http://media.renlearn.com/content/media/Marketing/10538/10538_sko2016_en_preview.JPG" alt="Play video" width="100%"/></a>
</div>
