How to add more than one video source with JS?

Question

EDIT: I think i haven't explained myself correctly.

I need to set (via javascript) more than one video source to my video.

For example set:

<source type="video/mp4" src="video.mp4"></source>
<source type="video/ogg" src="video.ogg"></source>

is there any way to do this? also if i only have a video that the currently web browser doesn't support will it fallback to flash?

Im using mediaelementjs (and jquery) (in a few words, what i need is to click an image and magically the browser supported video (another video) must load).

thanks!

your example doesn't seem to be showing. – nosarious Feb 16 '12 at 01:30 — nosarious, Feb 16 '12 at 01:30

score 1 · Answer 1 · edited May 23 '17 at 12:27

1

Yeah man, you can set more than one source so, the browser will load just the supported source , and in case that it doesn't support HTML5 video, it will load the embed tag (flash)

Here an example:

<video poster="myvideo.jpg" controls>
 <source src="myvideo.m4v" type="video/mp4" />
 <source src="myvideo.ogg" type="video/ogg" />
 <embed src="/to/my/video/player"></embed>
</video>

--- edited ---

So, you wanna to add more source tags dynamically. Like an onclick function. You have some options:

You can just change the src attribute in video element;
You can change the src attribute of each source element;
You can create more source elements and append all to the video element;

In any of these cases, you will need to run the load and play functions of video element after changes or add sources;

PS: remember that only one source will be played, the one that the browser can read. So you can't add a lot of videos (like different videos, instead differents extensions) and expect that a playlist will be created;

More questions about it:

edited May 23 '17 at 12:27

Community

1
1

answered Feb 16 '12 at 03:31

Rafael Verger

1,711
13
18

If using mediaelement.js this is the right approach but the embed is unnecessary. The library handles that. – Brian Nickel Feb 16 '12 at 03:43
This is just the way to use video element without javascript handlers :] – Rafael Verger Feb 16 '12 at 04:28
I haven't correctly explained myself. Please re-read my original question. – Pablini Mar 22 '12 at 21:57
@Pablini, do you wanna add a video tag or more sources tags? – Rafael Verger Mar 23 '12 at 03:26
@RafaelVerger I want to add more than one source tag after clicking a thumb (for example) – Pablini May 04 '12 at 17:26

How to add more than one video source with JS?

1 Answers1