爲什麼瀏覽器從所有來源加載視頻？

Question

我的頁面上有多個視頻元素。他們是這樣的：

<video class="video-js" width="800" height="500" controls="controls" preload="auto"> 
<source src="http://myurl.com/videos/video01.mp4" type="video/mp4" /> 
<source src="http://myurl.comvideos/video01.webmvp8.webm" type="video/webm" /> 
<source src="http://myurl.com/videos/video01.ogg" type="video/ogg" /> 
</video> 

我想不同的瀏覽器應該從他們需要的資源，而不是所有的三個來源所有視頻一次只加載視頻。儘管當我查看Firebug日誌時，我發現它們加載了所有文件，但花費時間太長。我能做些什麼來使瀏覽器只加載他們真正需要播放視頻的文件？

Answer 1

<video width="320" height="240" controls preload> 
    <source src="pr6.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'> 
    <source src="pr6.webm" type='video/webm; codecs="vp8, vorbis"'> 
    <source src="pr6.ogv" type='video/ogg; codecs="theora, vorbis"'> 
</video> 

您還必須指定一個編解碼器。

1. 類型Paramters：http://wiki.whatwg.org/wiki/Video_type_parameters
2. 完全指南：http://diveintohtml5.ep.io/video.html