javascript - videojs を使用すると、mp4 と webm が Web ブラウザーで競合を引き起こす

Question

以下のビデオプレーヤーvideojsを使用します。

<video id="font_video" class="video-js vjs-default-skin" controls preload="none" width="700" height="360" poster="" data-setup="{}">
  <source src="xxx.mp4" type='video/mp4' />
  <source src="xxx.webm" type='video/webm' />
</video>

<script>
   _V_.options.flash.swf = "assets/video-js.swf";
</script>

上記のコードはSafariでは正常に実行されますが、 ChromeとFirefox では実行されません。

次のように、 mp4とwebmの位置を入れ替えると:

<video id="font_video" class="video-js vjs-default-skin" controls preload="none" width="700" height="360" poster="" data-setup="{}">
  <source src="xxx.webm" type='video/webm' />
  <source src="xxx.mp4" type='video/mp4' />
</video>

その後、コードはSafariでは実行されなくなりますが、ChromeとFirefox では実行されます。誰か説明がありますか？