人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

HTMLで質問です。
PC、スマートフォンで、動画を流したいのですが
どういったファイル形式にし、どういうタグを埋め込めばよいでしょうか?
PCでは、IE7以上対応でお願いします。
※全てではなく、一部の形式をご存知な方もご回答ください。


●質問者: makocan
●カテゴリ:インターネット
○ 状態 :終了
└ 回答数 : 5/5件

▽最新の回答へ

1 ● だわかき
●25ポイント

HTML5対応ブラウザ(IE8以降、AndroidやiOSのブラウザ)では、videoタグで動画を埋め込みます。
http://www.htmq.com/html5/004.shtml
動画形式はH.264(拡張子MP4)が標準的です。

IE7はHTML5をサポートしていないので、objectタグを使って動画を埋め込みます。
http://yamayuri-w.jugem.jp/?eid=367
H.264は再生できます。


2 ● Hiroto
●25ポイント

html5で追加された、videoタグを利用するとスマートフォンでも動画を再生できます。*1

<video src="sample.ogv"></video>

とするか、

<video>
<source src="sample.mp4">
<source src="sample.ogv">
<p>お使いのブラウザでは動画を再生できません。</p>
</video>

とします。
この方法だと、最近のPCのブラウザでも再生することができますが、IE7以前と、IE7とIE8では再生できないので注意が必要です。
また、ファイル形式ですが、mp4形式、ogv形式、webm形式など(?)があるようですが、推奨の規格が未確定ですし、ブラウザごとにも異なるので、サンプルコードの後述の方法にしておくと無難でしょう。

※IE7とIE8では、プラグインを埋め込めば動画が再生できるようになるとは思いますが、このあたりは全然知識がないので他の方に任せます…。

*1:詳細: http://htmq.com/html5/video.shtml


3 ● holoholobird
●0ポイント

動画の拡張子にもよりますが、まずはyoutubeに動画を上げて、それを埋め込むのが一番簡単で確実でしょうね。

<iframe width="300" height="300" src="http://www.youtube.com/embed/W6QjKT1A2pI" frameborder="0" allowfullscreen></iframe>


こういう埋め込みコードで動画の開始時間と幅と高さを指定します。


makocanさんのコメント
外部サービスはNGでお願いします。

4 ● sin3364
●25ポイント

videoタグの解説 サンプルソース
http://html5.sophia-it.com/reference/%E3%83%93%E3%83%87%E3%82%AA%E3%82%92%E5%86%8D%E7%94%9F%E3%81%99%E3%82%8B%E3%81%AB%E3%81%AF%EF%BC%9F


5 ● boost_beast
●25ポイント

http://nojhon.s71.xrea.com/lecmusic03.html

こちらはどうでしょうか。

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ