Page 1 of 1

html5 video, timeupdate not working in IE11

Posted: Wed Oct 14, 2015 11:54 am
by Skara
Hi,

abbreviated...

Code: Select all

$(document).ready(function(){
    var video = $("#video");
    video.on('timeupdate',function(){
        //update scrub bar, update current timecode
    });
});

Code: Select all

<video width="720" height="405" id="video" poster="poster.png" src="/vrs/video.php?id=id&x=mp4">
    <source src="/vrs/video.php?id=id&x=mp4" type="video/mp4" />
    <source src="/vrs/video.php?id=id&x=webm" type="video/webm" />
    <p>Sorry! Your browser doesn\'t support HTML5 video.</p>
</video>
Runs fine in Chrome, Firefox, and Safari. Doesn't work at all in IE. The rest of my code works fine. My controls work, I can read video[0].currentTime, etc., everything is pretty well on point. Except that I can't get timeupdate to run in IE.

Thoughts on compatibility?

Re: html5 video, timeupdate not working in IE11

Posted: Wed Oct 14, 2015 4:13 pm
by Christopher
You might need to do something like this:

Code: Select all

jQuery('video').each(function () {
    var $video = jQuery(this),
        videoDuration;

    $video.on('loadedmetadata', function(event) {
        videoDuration = event.target.duration;

        $video.off('loadedmetadata');

        $video.on('timeupdate', {
            videoDuration: videoDuration
        },function (event) {
             //update scrub bar, update current timecode
        });      
    });

});