HTMLタグ/埋め込みタグ/様々な形式のデータを埋め込む

<object></object>

ブラウザ
分類: インライン要素
要素: object要素

object要素で、文書内に様々な形式のデータを埋め込むことができます。

この要素は、img要素、iframe要素、applet要素、（他、独自拡張のbgsound要素、embed要素）などの代わりに使用できますが、ブラウザの対応がまだ完全ではないようです。


<object data="example.jpg" type="image/jpeg" width="200" height="100"> ～ </object>

属性	値	説明
data=""	URI	埋め込むオブジェクトのURIを指定
type=""	MIMEタイプ	埋め込むオブジェクトのMIMEタイプを指定
classid=""	URI	実行プログラムのURIを指定
codetype=""	MIMEタイプ	実行プログラムのMIMEタイプを指定
codebase=""	URI	data属性とclassid属性の基準URIを指定
width=""	ピクセル数またはパーセント	オブジェクトの幅を指定
height=""	ピクセル数またはパーセント	オブジェクトの高さを指定

【代替の内容】

指定したデータが利用できない場合は、この要素の内容が代替として使用されることになります。

<object data="example.jpg" type="image/jpeg" width="200" height="100">
ここに代替の内容を記述
</object>

以下は、object要素内に代替内容を指定した例です。

■入れ子にして使用した例

次の例では、動画データ（MPEG）を再生できない場合は、静止画像（JPEG）が表示されるように指定しています。

<object data="example.mpeg" type="video/mpeg" width="200" height="100">
<object data="example.jpg" type="image/jpeg" width="200" height="100"></object>
</object>

■対応している要素で埋め込む例

次の例では、object要素に対応していない場合は、embed要素で埋め込まれるように指定しています。

<object classid="clsid: ..." codebase="http:// ..." type="application/x-shockwave-flash" width="200" height="100">

<param name="movie" value="example.swf">
<param name="loop" value="false">
<param name="quality" value="high">
<param name="bgcolor" value="#ffffff">

<embed src="example.swf" loop="false" quality="high" bgcolor="#ffffff" type="application/x-shockwave-flash" width="200" height="100" pluginspage="http:// ...">

</object>

【パラメータの指定】

パラメータを指定する場合は、object要素内の最初の部分（代替内容よりも前）にparam要素を配置します。

<object classid="clsid: ..." codebase="http:// ..." type="application/x-shockwave-flash" width="200" height="100">

<param name="movie" value="example.swf">
<param name="loop" value="false">
<param name="quality" value="high">
<param name="bgcolor" value="#ffffff">

<embed src="example.swf" loop="false" quality="high" bgcolor="#ffffff" type="application/x-shockwave-flash" width="200" height="100" pluginspage="http:// ...">

</object>

この要素は、head要素内に配置することも可能です。ただし、表示を必要としない内容（BGM等）に限られます。

使用例

■HTMLファイルを埋め込んだ例


<p><object data="example.html" type="text/html" width="300" height="100">
<a href="example.html">埋め込まれる文書</a>
</object></p>

表示例

※IEとFirefoxでは表示のされ方が異なります。（IEでは立体的な枠が付きますが、Firefoxでは付きません）

■画像ファイルを埋め込んだ例


<p>
<object data="example.jpg" type="image/jpeg" width="200" height="150">
<img src="example.jpg" alt="タマ" width="200" height="150">
</object>

<object data="example.gif" type="image/gif" width="200" height="150">
<img src="example.gif" alt="ハナ" width="200" height="150">
</object>
</p>

表示例

※IEとFirefoxでは表示のされ方が異なります。IE（7以下）では枠やスクロールバーが表示されますが、Firefoxではそれらが表示されません。

サイト内検索

埋め込みタグ

様々な形式のデータを埋め込む