Html-embed-multimedia

提供:Dev Guides
移動先:案内検索

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

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

<embed>タグを認識しないブラウザ用に <noembed> タグを含めることもできます。 たとえば、<embed>を使用して選択したムービーを表示し、ブラウザーが<embed>タグをサポートしていない場合、 <noembed> を使用して単一の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>タグで使用できる重要な属性のリストです。

'_-HTML5で廃止された_align_および_autostart_属性。 これらの属性を使用しないでください。_

Sr.No Attribute & Description
1

align

オブジェクトの配置方法を決定します。 center、_leftまたはright_のいずれかに設定できます。

2

autostart

このブール属性は、メディアを自動的に開始するかどうかを示します。 trueまたはfalseに設定できます。

3

loop

サウンドを連続して再生する(ループをtrueに設定する)か、特定の回数(正の値)するか、まったく再生しない(false)かを指定します

4

playcount

サウンドを再生する回数を指定します。 IEを使用している場合、これは_loop_の代替オプションです。

5

hidden

マルチメディアオブジェクトをページに表示するかどうかを指定します。 false値はnoを意味し、true値はyesを意味します。

6

width

オブジェクトの幅(ピクセル単位)

7

height

ピクセル単位のオブジェクトの高さ

8

name

オブジェクトの参照に使用される名前。

9

src

埋め込まれるオブジェクトのURL。

10

volume

サウンドの音量を制御します。 0(オフ)から100(フルボリューム)の範囲で指定できます。

サポートされているビデオの種類

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

  • * .swfファイル*-MacromediaのFlashプログラムによって作成されたファイルタイプです。
  • * .wmvファイル*-MicrosoftのWindowsのメディアビデオファイルタイプです。
  • * .movファイル*-AppleのQuick Time Movie形式です。
  • * .mpegファイル*-Moving Pictures Expert Groupによって作成されたムービーファイルです。
<!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ページのバックグラウンドでサウンドトラックを再生できます。 このタグはInternet Explorerでのみサポートされており、他のほとんどのブラウザーはこのタグを無視します。 ホストドキュメントがユーザーによって最初にダウンロードされて表示されるときに、オーディオファイルをダウンロードして再生します。 バックグラウンドサウンドファイルは、ユーザーがブラウザを更新するたびに再生されます。

-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 Objectタグ

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

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

例-1

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

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

ブラウザが_object_タグをサポートしていない場合、_alt_属性が表示されます。

例-2

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

<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
   alt : <a href = "data/test.pdf">test</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

次のようにFlashドキュメントを追加できます-

<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 Plug-inのバージョンを識別します。 オプションの_codebase_属性を使用して、JREをダウンロードするかどうか、およびダウンロードする方法を指定できます。