object要素 -- オブジェクトの埋め込み

基本データ

object要素
文書型 適用 子要素 開始タグ 終了タグ 分類
Strict param要素 インライン要素 ブロックレベル要素 必須 必須 インライン要素
Transitional
Frameset

属性

固有属性

data="データのURI"
Strict: ○ | Transitional: ○ | Frameset: ○
画像などのオブジェクトのデータのURIを指定します。
type="データのMIMEタイプ"
Strict: ○ | Transitional: ○ | Frameset: ○
data属性で指定されたデータのMIMEタイプを指定します。ユーザーエージェントが扱うことのできないデータを読み込むのを防ぐことができます。data属性と合わせて指定するとよいでしょう。
classid="プログラムのURI"
Strict: ○ | Transitional: ○ | Frameset: ○
プログラムのURIを指定します。URIのスキームにはHTTP用の「http」の他、Javaアプレット用の「java」、ActiveX用の「clsid」などが使われます。プログラムの実装を表す主要なURIは次のとおりです。
FLASH
clsid:D27CDB6E-AE6D-11cf-96B8-444553540000
Shockwave
clsid:166B1BCA-3F9C-11CF-8075-444553540000
RealOne Player
clsid:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA
QuickTime
clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B
Windows Media Player
clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95
Windows Media Player 7以降
clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6
Java
java:sample.class
ActiveX
clsid:333C7BC4-460F-11D0-BC04-0080C7055A83
codetype="プログラムのMIMEタイプ"
Strict: ○ | Transitional: ○ | Frameset: ○
classid属性で指定されたプログラムのMIMEタイプを指定します。ユーザーエージェントが扱うことのできないプログラムを実行するのを防ぐことができます。classid属性と合わせて指定するとよいでしょう。
codebase="基準のURI"
Strict: ○ | Transitional: ○ | Frameset: ○
基準となるURIを指定します。data属性、classid属性、archive属性に相対URIが指定されたときは、この属性のURIを基準に解決します。デフォルト値はHTML文書の基本URIです。
archive="関連リソースのURI"
Strict: ○ | Transitional: ○ | Frameset: ○
オブジェクトに関連するデータやプログラムのURIをスペースで区切って指定します。
width="横幅"
Strict: ○ | Transitional: ○ | Frameset: ○
オブジェクトの横幅をピクセル値かパーセント値で指定します。
height="縦幅"
Strict: ○ | Transitional: ○ | Frameset: ○
オブジェクトの縦幅をピクセル値かパーセント値で指定します。
usemap="イメージマップのURI"
Strict: ○ | Transitional: ○ | Frameset: ○
クライアント側・イメージマップを使うときに、対象となるmap要素のname属性の値を「#ID」の形式で指定します。URIの形式を取るので「#」が必要です。
declare
Strict: ○ | Transitional: ○ | Frameset: ○
この属性が設定されたオブジェクトは、宣言されただけで実行されません。
standby="読み込み時のメッセージ"
Strict: ○ | Transitional: ○ | Frameset: ○
データ読み込み時に表示するメッセージを指定します。
name="名前"
Strict: ○ | Transitional: ○ | Frameset: ○
スクリプトなどから参照できるようオブジェクトに名前をつけます。
tabindex="タブの順番"
Strict: ○ | Transitional: ○ | Frameset: ○
タブの移動する順番を指定します。指定できる値は0?32767です。ユーザーがTABを押すと、タブインデックスの小さい順にフォーカスが移動します。tabindex="0"を指定した要素やtabindex属性を持たない要素は、tabindex属性の値が最も大きい要素にフォーカスが移動した後、順番に選択されます。
align="表示位置"(非推奨)
Strict: × | Transitional: △ | Frameset: △
オブジェクトの表示位置を指定します。この属性は非推奨です。利用できる値は次のとおりです。
bottom
下揃え
middle
中央揃え
top
上揃え
left
オブジェクトを文章の左に回りこませます
right
オブジェクトを文章の右に回りこませます
CSSを使って代用することができます。
下揃え
object { vertical-align: bottom; }
中央揃え
object { vertical-align: middle; }
上揃え
object { vertical-align: top; }
左に回りこみ
object { float: left; }
右に回りこみ
object { float: right; }
border="枠線の太さ"(非推奨)
Strict: × | Transitional: △ | Frameset: △
オブジェクトにつける枠線の太さを指定します。この属性は非推奨です。
CSSで代用
object { border-width: 太さ; }
hspace="左右のスペース"(非推奨)
Strict: × | Transitional: △ | Frameset: △
オブジェクトの左右に挿入する空白の大きさをピクセル値で指定します。この属性は非推奨です。
CSSで代用
object { margin-left: 左の余白; margin-right: 右の余白; }
vspace="上下のスペース"(非推奨)
Strict: × | Transitional: △ | Frameset: △
オブジェクトの上下に挿入する空白の大きさをピクセル値で指定します。この属性は非推奨です。
CSSで代用
object { margin-top: 上の余白; margin-bottom: 下の余白; }

解説

画像、音楽、Flash、HTMLファイルなど様々な形式のデータを埋め込むための要素です。この要素はインライン要素です。オブジェクトの実行には次の三つが必要になります。(必ずしもすべて指定する必要はありません。)

object要素がどのように扱われるかは、ユーザーエージェントによって異なります。対象のデータが画像であれば、視覚系ブラウザは自身でデータを読み込み表示します。対象のデータがユーザーエージェント自身では扱えない形式なら、classid属性で示されたプログラム(外部プラグインなど)にデータとパラメータを渡します。

オブジェクト要素の中身は、param要素とブロックレベル要素・インライン要素です。最初に必要な分だけparam要素を配置します。その後に続けて、オブジェクトを実行できなかったとき代わりに表示する内容を記述します。

<object …>
  <param …>
  <param …>
  …
  オブジェクトの代わりの内容
</object>

オブジェクトを実行することに成功したら、object要素の中身は無視されます。(param要素map要素を除く。)そうでないなら、object要素の中身を表示します。object要素を入れ子にしておけば、「一番外側のオブジェクトを実行→失敗したらその内側のオブジェクトを実行→さらに失敗したら…」といった動作が可能になります。

次の例では、まずMPEGファイルの再生を試み、再生できなかったらGIFアニメーションを表示、それも表示できなかったら「宇宙から見た地球」と表示します。

<p>
  <object data="earth.mpg" type="video/mpeg">
    <object data="earth.gif" type="image/gif">
      宇宙から見た地球
    </object>
  </object>
</p>

object要素をhead要素内に配置し、音楽をバックグラウンドで再生することもできます。その場合はobject要素に中身を持たせることはできません。

  • clsidスキームは基本的にWindows専用のものです。
  • Internet Explorerはobject要素にほとんど対応していません。

Flash

Flashを再生するには次のように記述します。

<p>
  <object data="ファイルのURI" type="application/x-shockwave-flash"
    width="横幅" height="縦幅">
    <param name="movie" value="ファイルのURI">
    <!-- 再生できないとき -->
    代わりの内容
  </object>
</p>

param要素でパラメータを設定することができます。

パラメータ意味
movieファイルのURLURL
play自動再生true: する(デフォルト), false: しない
loop繰り返し再生true: する(デフォルト), false: しない
quality画質low: 低画質, medium: 中画質, high: 高画質(デフォルト), autolow: 低画質でスタートし、コンピュータの処理速度に合わせて画質を調整, autohigh: 高画質でスタートし、コンピュータの処理速度に合わせて画質を調整
bgcolor背景色#xxxxxx形式のカラーコード
scale縦横の比showall: 縦横の比率を変えず全体が見えるように表示(デフォルト), noborder: 縦横の比率は変えずトリミングして全体が見えるように表示, exactfit: 全体を引き伸ばして表示, noscale: 拡大縮小なし
menu右クリックメニューtrue: すべて表示(デフォルト), false: 「About」と「設定」のみ
salign表示領域内での表示位置l: 左, r: 右, t: 上, b: 下, c: 中央(デフォルト), tl: 左上, tr: 右上, bl: 左下, br: 右下

Welcome!
Copyright © FLASH工房

classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"を指定すると、Cecko系のブラウザで再生できなくなるようです。

Macromedia Flashはcodebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"というコードを出力しますが、codebase属性にプラグインのダウンロード先を指定するのは間違いです。(「http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0」がdata属性などの基準となるURIとみなされてしまいます。)

音楽・動画

音楽や動画を再生するには次のように記述します。

<p>
  <object data="ファイルのURL" type="MIMEタイプ"
    width="横幅" height="縦幅">
    <param name="src" value="ファイルのURL">
    <param name="autostart" value="false">
    <param name="loop" value="false">
    <!-- 再生できないとき -->
    代わりの内容
  </object>
</p>

type属性にはファイルの形式に応じたMIMEタイプを記述します。

MIMEタイプ
形式MIMEタイプ拡張子
MIDIaudio/midimid, midi
MPEG Audio (MP3)audio/mpegmp3
WAVE Audioaudio/wavwav
RealAudioaudio/x-pn-realaudioram, rm
RealAudio Pluginaudio/x-pn-realaudio-pluginrpm
RealAudioaudio/x-realaudiora
Windows Media Audioaudio/x-ms-wmawma
AU形式audio/basicau, snd
AIFF Audioaudio/x-aiffaif, aiff, aifc
MPEG Videovideo/mpegmpg, mpeg, mpe
Microsoft Video (AVI)video/x-msvideoavi
Microsoft Video (ASF)video/x-ms-asfasf, asx
Windows Media Videovideo/x-ms-wmvwmv
QuickTime Videovideo/quicktimemov, qt

param要素でパラメータを設定します。パラメータの意味は次のとおりです。

パラメータ(プラグイン版)
パラメータ意味
srcファイルのURL
autostart自動再生するか
loop繰り返し再生するか

Javaアプレット

Javaアプレットの場合は、classid属性にJavaアプレットのクラス名かクラスファイル名を指定します。classid属性のURIのスキームは「java」になります。

<p>
  <object classid="java:sample.class" codetype="application/java"
    width="横幅" height="縦幅">
    <param name="パラメータ1" value="値1">
    <param name="パラメータ2" value="値2">
    …
    <!-- 実行できない場合 -->
    代わりの内容
  </object>
</p>

画像

img要素を使わずに、object要素で画像を埋め込むことができます。object要素の中身にはインライン要素・ブロックレベル要素をともに含めることができるので、img要素のalt属性に比べ画像の代替テキストを柔軟に記述することができます。

<p>
  <object data="ファイルのURL" type="MIMEタイプ"
    width="横幅" height="縦幅">
    <!-- 表示できないとき -->
    代わりの内容
  </object>
</p>

画像を表示できません

外部HTML文書

iframe要素を使わずに、object要素で外部の文書ファイルを読み込むことができます。

<p>
  <object data="ファイルのURL" type="text/html"
    width="横幅" height="縦幅">
    <!-- 読み込めないとき -->
    代わりの内容
  </object>
</p>

テキストファイルなら、type="text/plain"としてください。

外部HTML文書を読み込めません。
参考サイト

Strict DTDの定義

<!ELEMENT OBJECT - - (PARAM | %flow;)*
 -- generic embedded object -->
<!ATTLIST OBJECT
  %attrs;                              -- %coreattrs, %i18n, %events --
  declare     (declare)      #IMPLIED  -- declare but don't instantiate flag --
  classid     %URI;          #IMPLIED  -- identifies an implementation --
  codebase    %URI;          #IMPLIED  -- base URI for classid, data, archive--
  data        %URI;          #IMPLIED  -- reference to object's data --
  type        %ContentType;  #IMPLIED  -- content type for data --
  codetype    %ContentType;  #IMPLIED  -- content type for code --
  archive     CDATA          #IMPLIED  -- space-separated list of URIs --
  standby     %Text;         #IMPLIED  -- message to show while loading --
  height      %Length;       #IMPLIED  -- override height --
  width       %Length;       #IMPLIED  -- override width --
  usemap      %URI;          #IMPLIED  -- use client-side image map --
  name        CDATA          #IMPLIED  -- submit as part of form --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  >

Information

現在の位置