Warning: Trying to access array offset on value of type bool in /home/yotigory/codingmania.net/public_html/wp-content/plugins/search-everything/config.php on line 29
html5のvideo要素だけを使って動画を再生する - CodingMania

2011/6/5

html5のvideo要素だけを使って動画を再生する

プラグインを使わずに動画を再生します。

動画の変換には、Miro Video Converterを使用しました。
幅と高さは指定要。
srcの記述はフルパスで。
videoタグに対応していないブラウザに対してビデオのダウンロードを促すメッセージを表示。
【注】Firefoxで動かすには、サーバ側に「.htaccess」を作って下記を書く必要があります。
AddType video/ogg .ogg .ogv
AddType audio/ogg .ogg
AddType application/ogg .ogg .ogv
※最後の行にも改行を入れておく。
文字コードは Shift_JIS で、改行コードは LF 。
.htaccess ファイルを設置したディレクトリ以下に適用されます。
パーミッションは604
サーバーによって違いがあるかもしれません。
【注】safariはQuickTimeがインストールされていないと動かなかったです。

あわせてご参考ください↓
「video.js」を使った動画ページ
html5media.jsを使ってmp4形式の動画を埋め込みます

HTMl

<video poster="poster.jpg" width="640" height="360" controls preload>
<source src="https://codingmania.net/demo/video/0001/movie/movie.mp4" />
<source src="https://codingmania.net/demo/video/0001/movie/movie.ogv" /> 
<p>ご利用のブラウザーでは再生できません。<a href="movie/movie.mp4">コチラ</a>からダウンロードしてください。</p>
</video>