動画・音楽

音楽やビデオの貼り付けは、ブラウザー特有の機能が多く以下にあげるものも、ブラウザに依存する機能です。XHTMLでは、OBJECTを使用するように推奨しています。

OBJECTの詳細はこちらで解説しています

下に、EMBEDとOBJECTのコード記述の例を挙げています。

ビデオの埋め込み

Functional list
タグ Attribute 終了タグ 説明
<BGSOUND>
back
 sound
記述例 なし <BGSOUND
 src="abc.mid"
 LOOP=2> IEのみの機能です。

EMBEDと違ってプラグインなどのアイコンが表示されることはありません。

src=
url
サウンドファイルのある場所を指定
LOOP=
n
繰り返す回数を指定
破棄された要素 HTML 4.0

OBJECT、例えば:

<OBJECT
data="audiofile.wav"
type="audio/wav" ...>
</OBJECT>
ページ中に表示されない音楽 OBJECT については下の EMBED 項目中のリンク先をご覧下さい。

注: 上記のテキスト効果同様、ページで音楽や音の使用が有意義であることは稀です。

<EMBED>
破棄された要素
記述例 なし <EMBED
src="abc.XLS"
WIDTH=300
HEIGHT=100>
src=
url
差込ファイルのある場所を指定、MIDIやワ−プロ文書なども利用できます。
WIDTH=
n
差込オブジェクトの表示の横幅を指定
HEIGHT=
n
差込オブジェクトの表示の縦幅を指定
AUTOSTART ペ−ジの表示と同時にサウンドを再生
LOOP 繰り返し回数一度だけ:false 無限:true
HIDDEN コントロ−ルツ−ルを未表示
VOLUME 音の大きさを指定0〜100
ALIGN 表示位置を指定
top
bottom
center
baseline
left
right
texttop
middle
absmiddle
absbotto
CONTROLS 操作パネルの種類
smallconsole小さいパネル
volumeleverボリュ−ムバ−
playbotton再生ボタン
stopbotton停止ボタン
pausebotton一時停止ボタン
例:YAMAHAのMIDIプラグイン等、

差込オブジェクトは、ブラウザ側のパソコンにそれらのファイルを表示可能なアプリケ−ション(プログラム)があれば有効に利用できます。

特にイントラネットでは、効果的に活用できるものです。

ここをクリックすると音がでます

HTML 4.0OBJECT .EMBED タグのOBJECT タグへの置き換えについては DevEdge の記事 を参照して下さい。

注: Gecko や他の最近のブラウザではまだサポートされていますが、 EMBED一度も W3C HTML 使用に含まれていません。

サポート品質は様々です。

Internet Explorer のサポートは大半の Netscape プラグインと非互換です。

OBJECT のサポートは普遍的ではありません、特に古いブラウザでは。

<META>
generic
 met
information
記述例 なし <NETA
 HTTP-EQUIV="refresh"
 CONTENT="15;
URL=abc.htm">
HTTP-EQUIV=
"refresh"
現在はこれだけの機能らしい。

アドレスを変更した場合に多く使用してます。

定期的に内容が更新されるようなペ−ジの場合は、URLにそのペ−ジ自身のアドレスを指定すれば、一定期間に自動更新させられます。

CONTENT="n; 動作開始までの秒数
URL=abc.htm 指定時間後に呼び出すURL

OBJECT

EMBEDでのMIDI再生の記述例

<embed src="music.mid"
type="audio/midi"
name="M1"
loop="true"
autostart="false"
width="300" height="200">

OBJECTでの記述例

<object data="slam.mid" type="audio/midi" width="300" height="200" id="M1" />
<param name="src" value:値="sample.mid" />
<param name="autostart" value:値="false" />
</object>

Functional list
属性 説明
ALIGN 周りのテキストとの位置関係を指定する事が出来ます。

abcbottom/absmiddle/baseline/bottom/
center/left
/middle/right/texttop

ARCHIVE オブジェクトに関連するリソースがアーカイブされている時に、そのアーカイブファイルのURLリストをスペースで区切って指定する。
BORDER <A HREF="...">〜</A>で囲まれている時の枠線の太さを指定します。
CLASSID 実行ファイルのURLを指定します。

データの形式に応じてDATA属性と併用したり代用されたりします。

IEでActiveXコントロールを貼り付ける場合は、CLSID:class-identifierを指定します。

CODEBASEを基準とします。

CODE コードのURLを指定する。
CODEBASE CLASSID、DATA、ARCHIVE属性のURLを探す基準となるURL
CODETYPE CLASSIDで指定したプログラムのMIMEタイプ
DATA 埋め込むデータファイルのURL
DATAFLD データバインド機能を用いる際の、データソースの列名
DATAFORMATS データバインド機能を用いる際の、データのフォーマットをhtmlまたはtextで指定
DATASRC データバインド機能を用いる際の、データソースのID
DECLARE この属性があると、オブジェクトはダウンロードされてもすぐには実行されず、他のOBJECTタグから起動されるまで待機状態になります。
NAME 名前を指定する事が出来ます。
STANDBY オブジェクトをダウンロード中に表示しておくテキストを指定
TABINDEX タブインデックス
TYPE DATA属性で指定したデータのMIMEタイプ
USEMAP クライアントサイドクリッカブルマップを使用する際の<MAP>のID
HEIGHT 縦幅ををpxか%で指定
HSPACE オブジェクトの周りの横方向の余白を指定px
VSPACE オブジェクトの周りの縦方向の余白を指定px
WIDTH 横幅ををpxか%で指定

Active Xでの指定

Active Xで指定する場合、<OBJECT>タグで指定します。

CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"で、Media Playerの指定し、<PARAM>で再生の指定をします。

value:値のON・OFFは、true(-1)で設定、false(0)で設定なしになります。

<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"id="MediaPlayer">
<param name="Filename" value:値="URL">
<param name="AutoStart" value:値="自動スタート true | false">
<param name="AutoRewind" value:値="自動巻き戻し true | false">
<param name="PlayCount" value:値="再生回数 0で無限">
<param name="AutoRewind" value:値="自動巻き戻し true | false">
<param name="Volume" value:値="音量 -10000~0">
<param name="Balance" value:値="左右の音量バランス -10000>0<10000">
<param name="ShowControls" value:値="全てのコントロールバー true | false">
<param name="ShowAudioControls" value:値="音量コントロールバー true | false">
<param name="ShowDisplay" value:値="タイトル・著作権 true | false">
<param name="ShowGotoBar" value:値="関連リンクバー true | false">
<param name="ShowPositionControls" value:値="早送り・巻き戻しバー true | false">
<param name="ShowStatusBar" value:値="ステータスバー true | false">
<param name="ShowTracker" value:値="再生位置バー true | false">

   

ビデオの埋め込み

RealPlayer用

<OBJECT ID=video1 CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" height="120" width="160"> <param name="controls" value:値="ImageWindow">
<param name="console" value:値="Clip1">
<param name="autostart" value:値="true">
<param name="src" value:値="./modoki.rpm">
<embed src="./modoki.rpm" type="audio/x-pn-realaudio-plugin" console="Clip1" controls="ImageWindow" height="120" width="160" autostart="true" nojava="true" pluginspage="http://www.jp.real.com/">
</EMBED>
</OBJECT>
<br>
<OBJECT ID=video1 CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" height="100" width="300"> <param name="controls" value:値="ControlPanel">
<param name="console" value:値="Clip1">
<param name="autostart" value:値="true">
<param name="src" value:値="./modoki.rpm">
<embed src="./modoki.rpm" type="audio/x-pn-realaudio-plugin" console="Clip1" controls="ControlPanel" height="100" width="300" autostart="true" nojava="true" pluginspage="http://www.jp.real.com/">
</EMBED>
</OBJECT>

*赤字部分が上と下の<OBJECT>タグの記述で異なる部分です。

ImageWindowで映像画面を、ControlPanelで、コントロールパネルを表示し、Consoleを同一の"Clip1"とすることで、関連付けて(コントロールパネルで画像を操作できるようにして)います。

widthとheightは、画像の大きさを指定するときと同様です。

Windows Media Player用

<OBJECT ID=video2 CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" height="144" width="176"> <param name="controls" value:値="ImageWindow">
<param name="console" value:値="Clip2">
<param name="autostart" value:値="true">
<param name="src" value:値="./modoki.asx">
<embed src="./modoki.asx" type="video/x-ms-asf" console="Clip2" controls="ImageWindow" height="144" width="176" autostart="true" nojava="true" pluginspage= "http://www.asia.microsoft.com/japan/windows/windowsmedia/">
</EMBED>
</OBJECT>

 

HOMEの次HTMLの次BGM



目的別要素

広告