0
votes

I'm having issues with my videos not being played back in firefox. I'm attempting to dynamically update one video element's source to play multiple videos without re-creating the element every time my function is called.

E.g., first click makes the video source = video1.mp4, next click maintains that video player, but changes the source = video2.mp4 without recreating the element.

My reason for doing this is to only have to use one filetype for all browsers. I realize I could just make another source tag under the video element and give it a MIME type of video/ogg and it would work with HTML5 in firefox, but I want to have a universal format to take the burden off my users.

I can get this to work perfectly fine in chrome, but when changing to firefox the flash player only plays the first video source then for some reason becomes undefined.

Firstly, I created a video element inside a lightbox. The lightbox is opened through a function which is called onclick of an anchor tag. When the lightbox is opened, I initialize a videojs player of the video, then set its source to the URL passed into the function. I then load the player, and play it. This works perfectly fine in chrome with HTML5, but in firefox the flash fallback works once then breaks.

I was reading about the problem and thought my problem might be the fact that flash converts the video element into a flash object, then when I try to reference the video with the same ID again, it isn't found because it doesn't exist as a video element anymore.

Here is a code sample: http://jsfiddle.net/7WTrh/12/

I tested in chrome, and it works, but firefox does not.

Thanks for the help in advance.

1

1 Answers

2
votes

When you're changing the source, you need to make sure you're passing the mime type as well, so video.js knows what tech it needs.

myPlayer.src({ src: "vid.mp4", type: "video/mp4" });