Web 経由でオーディオとビデオの両方を再生する場合の選択肢を見つけようとしています。私は HTML 5<video />
と<audio />
. しかし、HTML のビデオ/オーディオが失敗した場合に、Flash のビデオ/オーディオを表示できるようにしたいと考えています。
ビデオ/オーディオが何らかの理由で再生されていないかどうかを検出し、HTML5 プレーヤーを Flash プレーヤーに交換する簡単な方法はありますか?
Web 経由でオーディオとビデオの両方を再生する場合の選択肢を見つけようとしています。私は HTML 5<video />
と<audio />
. しかし、HTML のビデオ/オーディオが失敗した場合に、Flash のビデオ/オーディオを表示できるようにしたいと考えています。
ビデオ/オーディオが何らかの理由で再生されていないかどうかを検出し、HTML5 プレーヤーを Flash プレーヤーに交換する簡単な方法はありますか?
タグ内の最後のアイテムとしてFlashの代替をポップすることができ<video>
、HTML5ビデオが再生されない場合は再生されます。
包括的で定期的に更新されるMarkPilgrimの例を参照してください:http://diveintohtml5.ep.io/video.html#example
要約すると:
<video>
<!-- HTML5 video -->
<source src="video.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="video.ogv" type='video/ogg; codecs="theora, vorbis"'>
<source src="video.mp4">
<!-- Flash player fallback for user agents that don’t support HTML5 video -->
<!-- All user agents that don’t understand the <video> tag, or don’t support
the video formats you’ve provided, will show this instead. Even IE 6. -->
<object width="320" height="240" type="application/x-shockwave-flash"
data="flowplayer-3.2.1.swf">
<param name="movie" value="flowplayer-3.2.1.swf">
<param name="flashvars" value='config={"clip": {"url": "video.mp4", "autoPlay":false, "autoBuffering":true}}'>
</object>
</video>
Flash ビデオ プレーヤーを自由に選択できる場合は、HTML5/Flash フォールバックが実装されている JWPlayer を試してください。
MediaElementJSをお勧めします。
しかし、あなたの質問に答えるために、ビデオ、オーディオ、およびソース要素の性質により、さまざまなソースをブロワーに提示し、ブロワーが再生できるものを選択することができます。それらのいずれも再生できない場合は、フラッシュの代替手段を提供する限り、先に進んでそれを使用します。
Modernizrを使用して、特定のHTML5タグがサポートされているかどうかを確認し、サポートされていない場合はフェイルセーフオプションに切り替えることができます。例:
if (Modernizr.video) {
//start using HTML5's video tag
} else {
// use flash
}
これは、Modernizr Deploy HTML5&CSS3 w/Modernizrの使用方法に関するチュートリアルです。