項 目 | 説 明 |
---|---|
記述形式 | <object>~</object> |
対応ブラウザー | H4+ / e3+ / N4+ / Fx1+ / Op6+ / Ch1+ / Sa1+ |
種 類 (カテゴリー) |
フロー・コンテンツ,フレージング・コンテンツ,エンベッディッド・コンテンツ, インタラクティブ・コンテンツ(usemap属性をもつとき), パルパブル・コンテンツ |
置ける場所 | エンベッディッド・コンテンツが記入できる場所 |
内包要素 (コンテンツ・モデル) |
0個以上の param要素,トランスペアレント (コンテンツ・モデル: カテゴリー) |
<object> は,<applet>,<embed>,<bgsound>,<img> などに代わり,Java アプレットやマルチメディアリソースなどをページ上に貼り付けるための汎用的な要素です。 詳細なパラメータ制御には <param> を用います。
なお,<object>~</object> 間には,object要素に対応していないブラウザーや,指定されたコンテンツを扱えない場合のフォールバック・コンテンツ(代替のコンテンツ)を記入します。
<object> の動作は,ブラウザーやそのバージョン,インストールされているプラグインの種類などによって大きく異なるので注意してください。 現状ではまだブラウザー側の対応が完全ではないために,<object> や <applet> や <embed> などが混在した状況になっています。
種 類 | 名 称 |
---|---|
【固有属性】 | data, type, typemustmatch *, name, usemap, form, width, height |
【グローバル属性】 | accesskey,class,contenteditable *,
dir, hidden *,id, lang,spellcheck *,style, tabindex,title,translate * |
【ARIA role属性】 で 指定可能な値 (役割) |
application,document,img,または, presentation |
【ARIA aria-* 属性】 で 指定可能なもの |
ARIA グローバル状態とプロパティ, 指定可能な役割の任意の状態とプロパティ |
HTML5 では,align, archive, border, classid, codebase, codetype, declare, hspace, standby, vspace などの属性が廃止されました。 とくに,classid に関しては,代わりに type属性の値に登録済みのMIMEタイプ を設定することで置き換える必要があります(以下の例では未修正)。 HTML5 で利用可能な属性は,以下の通りです。
種 類 | 名 称 |
---|---|
【よく使うもの】 |
下記のようにして画像オブジェクトを張りつけることができます。
<object data="xxx.gif" type="image/gif" width="100" height="100"></object>
次の例では,PNG 画像がサポートされていれば PNG 画像を,サポートされていなければ GIF 画像を貼り付けます。
<object data="xx.png" type="image/png" height="100" width="100"> <object data="xx.gif" type="image/gif" height="100" width="100"> </object> </object>
RealNetworks 社の RealMedia を再生するコントロールを張りつけます。 <object> 未サポートのブラウザーのために,内部で <embed> による呼び出しも記述しています。 → RealMedia 入門
<object classid="CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA" width="260" height="30"> <param name="SRC" value="dummy.rm"> <param name="AUTOSTART" value="false"> <param name="CONTROLS" value="ControlPanel"> <param name="CONSOLE" value="cons"> <param name="NOLOGO" value="true"> <embed type="audio/x-pn-realaudio-plugin" src="xxx.rm" autostart="false" width="260" height="30" controls="ControlPanel" console="cons" name="player" nologo="true"> </embed>
</object>
次の例では,IE4.0 に標準でサポートされている ActiveX コントロールのひとつを使用して,動く画像を実現します。(IE4.0~)
<img id="img1" src="xxx.gif" style="position:absolute"> <object classid="clsid:D7A7D7C3-D47F-11D0-89D3-00A0C90833E6"> <param name="AutoStart" value="-1"> <param name="Direction" value="1"> <param name="Repeat" value="-1"> <param name="Bounce" value="0"> <param name="Duration" value="5"> <param name="Shape" value="Rect(0,0,100,100)"> <param name="Target" value="img1"> <param name="TimerInterval" value="0.02"> </object>