HTML-マルチメディアを埋め込む

Webページに音楽やビデオを追加する必要がある場合があります。Webサイトにビデオまたはサウンドを追加する最も簡単な方法は、という特別なHTMLタグを含めることです。<embed>。このタグにより、ブラウザ自体に、ブラウザが<embed>タグと指定されたメディアタイプをサポートする場合に自動的に提供されるマルチメディアのコントロールが含まれます。

を含めることもできます <noembed><embed>タグを認識しないブラウザのタグ。たとえば、<embed>を使用して、選択したムービーを表示し、<noembed> ブラウザが<embed>タグをサポートしていない場合に、単一のJPG画像を表示します。

例

埋め込まれたMIDIファイルを再生する簡単な例を次に示します-

<!DOCTYPE html>
<html>

   <head>
      <title>HTML embed Tag</title>
   </head>
	
   <body>
      <embed src = "/html/yourfile.mid" width = "100%" height = "60" >
         <noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
      </embed>
   </body>

</html>

<embed>タグ属性

以下は、<embed>タグで使用できる重要な属性のリストです。

Note-HTML5で廃止されたalign属性とautostart属性。これらの属性は使用しないでください。

シニア番号	属性と説明
1	align オブジェクトの位置合わせ方法を決定します。中央、左、右のいずれかに設定できます。
2	autostart このブール属性は、メディアを自動的に開始する必要があるかどうかを示します。trueまたはfalseのいずれかに設定できます。
3	loop サウンドを継続的に再生するか（ループをtrueに設定）、特定の回数再生するか（正の値）、まったく再生しないか（false）を指定します。
4	playcount サウンドを再生する回数を指定します。IEを使用している場合、これはループの代替オプションです。
5	hidden マルチメディアオブジェクトをページに表示するかどうかを指定します。偽の値はいいえを意味し、真の値ははいを意味します。
6	width オブジェクトの幅（ピクセル単位）
7	height オブジェクトの高さ（ピクセル単位）
8	name オブジェクトを参照するために使用される名前。
9	src 埋め込まれるオブジェクトのURL。
10	volume 音量を調節します。0（オフ）から100（フルボリューム）まで指定できます。

サポートされているビデオタイプ

埋め込みタグ内では、Flashムービー（.swf）、AVI（.avi）、MOV（.mov）ファイルタイプなどのさまざまなメディアタイプを使用できます。

.swf files −MacromediaのFlashプログラムによって作成されたファイルタイプです。
.wmv files −MicrosoftのWindowのメディアビデオファイルタイプです。
.mov files −はAppleのQuick TimeMovieフォーマットです。
.mpeg files −は、Moving Pictures ExpertGroupによって作成されたムービーファイルです。

<!DOCTYPE html>
<html>

   <head>
      <title>HTML embed Tag</title>
   </head>

   <body>
      <embed src = "/html/yourfile.swf" width = "200" height = "200" >
         <noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
      </embed>
   </body>

</html>

これにより、次の結果が生成されます-

バックグラウンドオーディオ

HTMLを使用できます <bgsound>Webページのバックグラウンドでサウンドトラックを再生するためのタグ。このタグはInternetExplorerでのみサポートされており、他のほとんどのブラウザはこのタグを無視します。ホストドキュメントがユーザーによって最初にダウンロードされて表示されるときに、オーディオファイルをダウンロードして再生します。バックグラウンドサウンドファイルは、ユーザーがブラウザを更新するたびに再生されます。

Note− bgsoundタグは非推奨であり、HTMLの将来のバージョンで削除される予定です。したがって、これらを使用するのではなく、サウンドを追加するためにHTML5タグオーディオを使用することをお勧めします。ただし、学習を目的として、この章ではbgsoundタグについて詳しく説明します。

このタグには、loopとsrcの2つの属性しかありません。これらの属性は両方とも、上記で説明したのと同じ意味を持ちます。

これは小さなmidiファイルを再生する簡単な例です-

<!DOCTYPE html>
<html>

   <head>
      <title>HTML embed Tag</title>
   </head>
	
   <body>
      <bgsound src = "/html/yourfile.mid">
         <noembed><img src = "yourimage.gif" ></noembed>
      </bgsound>
   </body>
	
</html>

これにより、空白の画面が生成されます。このタグはコンポーネントを表示せず、非表示のままです。

Internet Explorerは、3つの異なるサウンド形式ファイルのみを処理することもできます。wavはPCのネイティブ形式です。au、ほとんどのUnixワークステーションのネイティブフォーマット。そしてMIDI、ユニバーサルミュージックエンコーディングスキーム。

HTMLオブジェクトタグ

HTML4では <object>elementは、汎用オブジェクトの包含に対する万能ソリューションを提供します。ザ・<object> 要素を使用すると、HTML作成者は、ユーザーエージェントによる表示のためにオブジェクトに必要なすべてを指定できます。

ここにいくつかの例があります-

例-1

次のように、HTMLドキュメント自体にHTMLドキュメントを埋め込むことができます-

<object data = "data/test.htm" type = "text/html" width = "300" height = "200">
   alt : <a href = "data/test.htm">test.htm</a>
</object>

ここで、ブラウザがオブジェクトタグをサポートしていない場合、alt属性が表示されます。

例-2

次のように、PDFドキュメントをHTMLドキュメントに埋め込むことができます-

<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
   alt : <a href = "data/test.pdf">test.htm</a>
</object>

例-3

ドキュメントに関連するいくつかのパラメータを指定できます <param>鬼ごっこ。これはwavファイルを埋め込む例です-

<object data = "data/test.wav" type = "audio/x-wav" width = "200" height = "20">
   <param name = "src" value = "data/test.wav">
   <param name = "autoplay" value = "false">
   <param name = "autoStart" value = "0">
   alt : <a href = "data/test.wav">test.wav</a>
</object>

例-4

次のようにフラッシュドキュメントを追加できます-

<object classid = "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id = "penguin" 
   codebase = "someplace/swflash.cab" width = "200" height = "300">
   
   <param name = "movie" value = "flash/penguin.swf" />
   <param name = "quality" value = "high" />
   <img src = "penguin.jpg" width = "200" height = "300" alt = "Penguin" />
</object>

例-5

次のように、JavaアプレットをHTMLドキュメントに追加できます。

<object classid = "clsid:8ad9c840-044e-11d1-b3e9-00805f499d93" 
   width = "200" height = "200">
   <param name = "code" value = "applet.class">
</object>

ザ・ classid属性は、使用するJavaプラグインのバージョンを識別します。オプションのコードベース属性を使用して、JREをダウンロードするかどうかとダウンロードする方法を指定できます。