html - 画像またはビデオを選択する

Question

画像またはビデオをHTMLで表示する方法を理解しようとしています。明確にするために、ビデオを表示したいのですが、ビデオがないかファイルが見つからない場合は、代わりにデフォルトの画像を表示したいと思います。基本的に、ビデオが存在しないか存在しない場合に表示する画像ファイル。これも可能ですか？私はしばらくの間これを理解しようとしてきました。運がない。どんな助けでもいただければ幸いです。

Answer 1

JavaScript を一切使用せずに、Flash への HTML5 ビデオ フォールバックと単純なイメージへの Flash フォールバックを提供するこのコードをチェックしてください。

<!-- first try HTML5 playback: if serving as XML, expand `controls` to `controls="controls"` and autoplay likewise -->
<!-- warning: playback does not work on iOS3 if you include the poster attribute! fixed in iOS4.0 -->
<video width="100%" height="200px" controls>

    <!-- MP4 must be first for iPad! -->
    <source src="__VIDEO__.MP4" type="video/mp4" /><!-- Safari / iOS video    -->
    <source src="__VIDEO__.OGV" type="video/ogg" /><!-- Firefox / Opera / Chrome10 -->

    <!-- fallback to Flash: -->
    <object width="640" height="360" type="application/x-shockwave-flash" data="__FLASH__.SWF">

         <!-- Firefox uses the `data` attribute above, IE/Safari uses the param below -->
         <param name="movie" value="__FLASH__.SWF" />
         <param name="flashvars" value="controlbar=over&amp;image=__POSTER__.JPG&amp;file=__VIDEO__.MP4" />

         <!-- fallback image. note the title field below, put the title of the video there -->
         <img src="__VIDEO__.JPG" width="640" height="360" alt="__TITLE__"
         title="No video playback capabilities, please download the video below" />
    </object>
</video>

<!-- you *must* offer a download link as they may be able to play the file locally. customise this bit all you want -->
<p>    
     <strong>Download Video:</strong>
     Closed Format: <a href="__VIDEO__.MP4">"MP4"</a>
     Open Format:   <a href="__VIDEO__.OGV">"Ogg"</a>
</p>​