Video tag doesn't work with multiple sources

[fairsayan]

I tried to use HTML5 sytanx for multiple sources as desribed in
http://dev.w3.org/html5/spec/video.html

<video autoplay>
<source src='video1.mp4'>
<source src='video2.mp4'>
</video>

but it seems to play only the first one because if you invert the two
sources it plays only video2.mp4.
I tried also to use "loop" attribute and it loops only the first
source as well.

Any idea?

Fair

[Mike Taylor]

That is correct. The idea behind providing multiple <sources> is so you can provide multiple encodings, or a flash movie as fallback, for example. If the UA supports .mp4s, it plays the first, as specced, http://dev.w3.org/html5/spec/video.html#media-element-attributes

"Otherwise, if the media element does not have a src attribute but has a source element child, then let mode be children and letcandidate be the first such source element child in tree order."

You can just change the value of the src attribute and call the load() method via script to play a different video resource, if that's what you're after.

Best,
Mike

[fairsayan]

Thank you very much: I misunderstood HTML5 specifications.
Fair

On 18 Feb, 18:11, Mike Taylor <miketa...@gmail.com> wrote:
> On 2/18/10 5:10 AM, fairsayan wrote:
>
>
>
> > I tried to use HTML5 sytanx for multiple sources as desribed in
> >http://dev.w3.org/html5/spec/video.html
>
> > <video autoplay>
> >   <source src='video1.mp4'>
> >   <source src='video2.mp4'>
> > </video>
>
> > but it seems to play only the first one because if you invert the two
> > sources it plays only video2.mp4.
> > I tried also to use "loop" attribute and it loops only the first
> > source as well.
>
> > Any idea?
>
> > Fair
>
> That is correct. The idea behind providing multiple <sources> is so you
> can provide multiple encodings, or a flash movie as fallback, for

> example. If the UA supports .mp4s, it plays the first, as specced,http://dev.w3.org/html5/spec/video.html#media-element-attributes
>
> "Otherwise, if the media element <#media-element> does not have a |src
> <#attr-media-src>| attribute but has a |source <#the-source-element>|
> element child, then let mode be /children/ and letcandidate be the first
> such |source <#the-source-element>| element child in tree order
> <infrastructure.html#tree-order>."

[Mark Pilgrim]

On Thu, Feb 18, 2010 at 5:10 AM, fairsayan <domenico...@gmail.com> wrote:
> I tried to use HTML5 sytanx for multiple sources as desribed in
> http://dev.w3.org/html5/spec/video.html
>
> <video autoplay>
>  <source src='video1.mp4'>
>  <source src='video2.mp4'>
> </video>
>
> but it seems to play only the first one because if you invert the two
> sources it plays only video2.mp4.

Source elements are for choosing between different representations of
the same video (like if one video is H.264/AAC/MP4 and one video is
Theora/Vorbis/Ogg). Browsers pick the first one they can play and
ignore the rest. If you want to "chain" multiple videos together,
you'll need to use JavaScript like Mike said.

-Mark

[Remy Sharp]

I inadvertently posted this directly to Fair, instead of to the group - basically says the same thing as Mike and Mark - but I figured it would be worth posting properly:

The source element is used to tell the browser about *alternative* sources for the video - so it won't play one then the other, it will try to load the first one and if it works it'll play it. If it can't play it, it'll move on to the next one.

For example, Firefox doesn't support H.264, so you need to feed it an Ogg Theora encoded video via an alternative source:

<video autoplay>
<source src='video1.ogv'>
<source src='video1.mp4'>
</video>

This way video1 will play happily in either browsers that support Ogg Theroa or H.264.

Remy Sharp
Left Logic

> --
> You received this message because you are subscribed to the Google Groups "Chromium HTML5" group.
> To post to this group, send email to chromiu...@chromium.org.
> To unsubscribe from this group, send email to chromium-html...@chromium.org.
> For more options, visit this group at http://groups.google.com/a/chromium.org/group/chromium-html5/?hl=en.
>

[Ernest Delgado]

On Feb 18, 9:11 am, Mike Taylor <miketa...@gmail.com> wrote:
> On 2/18/10 5:10 AM, fairsayan wrote:
>
>
>
> > I tried to use HTML5 sytanx for multiple sources as desribed in
> >http://dev.w3.org/html5/spec/video.html
>
> > <video autoplay>
> >   <source src='video1.mp4'>
> >   <source src='video2.mp4'>
> > </video>
>
> > but it seems to play only the first one because if you invert the two
> > sources it plays only video2.mp4.
> > I tried also to use "loop" attribute and it loops only the first
> > source as well.
>
> > Any idea?
>
> > Fair
>
> That is correct. The idea behind providing multiple <sources> is so you
> can provide multiple encodings, or a flash movie as fallback, for
> example. If the UA supports .mp4s, it plays the first, as specced,http://dev.w3.org/html5/spec/video.html#media-element-attributes
>

To avoid confusion, I'd want to emphasize that you can provide
multiple encodings with this technique but not the flash fallback.
If you have flash content inside the audio tag this will be rendered
only if the audio tag is not supported at all (unless you use some
Javascript as a workaround)
If none of the formats you specify in the source tags are supported
then nothing will be rendered in any case.

Here you can see how to use the JavaScript workaround I mentioned:
http://www.html5rocks.com/samples/audio/quick/
The sample is for the audio tag but it applies the same way for the
video tag.

> "Otherwise, if the media element <#media-element> does not have a |src
> <#attr-media-src>| attribute but has a |source <#the-source-element>|
> element child, then let mode be /children/ and letcandidate be the first
> such |source <#the-source-element>| element child in tree order
> <infrastructure.html#tree-order>."
>