Fenoec
Fenoec

Reputation: 179

HTML5 Video tag switching src causes video format error

I am using a HTML5 video tag on my web page which loads a video fine with .ogg and .webm formats when the page is initially loaded. However, when I try to switch the src to a different video I have also tested (and works) when the page is loaded, I get a "Video format or MIME type is not supported" error in Firefox. Chrome just doesn't show anything.

Here is the html for the video:

<video width="320" id="player" height="240" src="~/Videos/video.webm" controls></video>

Here is the javascript to change the src:

hub.client.displayVideo = function (video) 
{
    var player = $('#player').get(0);
    // Change the video to be displayed
    if (player.canPlayType('video/webm'))
    {
        player.src = video + ".webm";
    }
}

Every example of changing the src for the video tag I've seen does something very similar to this and I can see that the src attribute has changed correctly when I inspect the video element. Clearly Firefox supports the format since it plays correctly initially, so what am I missing?

Upvotes: 1

Views: 724

Answers (1)

wonesy
wonesy

Reputation: 34

try pausing, switching src, loading, and playing (not sure if every one of these steps is necessary).

hub.client.displayVideo = function (video) 
{
    var player = $('#player').get(0);

    // Change the video to be displayed
    if (player.canPlayType('video/webm'))
    {
        player.pause()
        player.src = video + ".webm";
        player.load()
        player.play()
    }

}

Upvotes: 0

Related Questions