object (HTML element)

Spec
Depr. Empty Version
No No HTML 4
Browser support (more…)
IE5.5+ FF1+ SA1.3+ OP9.2+ CH2+
Partial Partial Partial Partial Partial

Syntax

<object archive="uri" border=" { number | percentage } " classid="class ID" codebase="uri" codetype="MIME type" data="uri" height=" { number | percentage } " type="MIME type" width=" { number | percentage } ">
</object>

Description

The object element’s purpose is to embed into a document a variety of different kinds of media files. Historically, it was used primarily for placing ActiveX controls onto a page, but it can also be used to embed images (.gif, .jpg, and so on), movie files and applets, video files, PDF documents, Flash, and even HTML.

While this element is specified in the HTML 4 recommendation, and thus constitutes valid markup, it’s often shunned in favor of the better supported, but nonstandard embed element.

To embed Flash using object, rather than going down the nonstandard embed route, use the following markup:

<object data="movie.swf"
    type="application/x-shockwave-flash"
    width="200" height="100">
  <param name="movie" value="movie.swf">
  <param name="wmode" value="opaque">
</object>

The param element with the name of "movie" helps Internet Explorer to load the Flash file. The "wmode" encourages IE to play nicely with the z-index property, allowing other elements to be placed on top of the Flash movie.

Example

In this example, a super-simple object element is used to display an image:

<object data="giant-dog.jpg">
</object>

Use This For …

This element is used for media files, applets, and ActiveX objects. For images, it’s currently better practice to use the completely supported img element, rather than take a risk using object; img is also far less clunky to use.

Compatibility

Internet Explorer Firefox Safari Opera Chrome
5.5 6.0 7.0 8.0 1.0 1.5 2.0 3.0 3.5 1.3 2.0 3.1 4.0 9.2 9.5 10.0 2.0
Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial Partial

This element is not completely supported, although it has to be said that the support that is available very much depends on the type of object that’s being embedded. Internet Explorer displays simple images poorly, with horizontal and vertical scrollbars, but is able to display an embedded Word document, albeit with a warning in the form of an ActiveX alert. Safari and Firefox, on the other hand, behaves impeccably with images, yet no amount of coaxing or installing of third-party plugins will allow the Word document to display—even with Microsoft Office installed on the host machine. For this reason, before you apply it, you should consider the purpose for which you need to use the object element. If it’s to display images, you’ll likely be better off to use the img element.

In this Section

  • align
    sets the alignment or position of the object relative to surrounding content
  • archive
    defines the location of the archive file
  • border
    sets the border thickness around the object
  • classid
    defines the URL or internal reference for the object’s implementation
  • codebase
    defines a relative base URL for objects specified in the classid attribute
  • codetype
    defines the MIME type for the object
  • data
    specifies the location of the data or file that the object requires
  • declare
    specifies that object should be downloaded but not instantiated
  • height
    sets the object’s height
  • hspace
    sets amount of space to appear on either side for the object
  • name
    specifies a name by which the object element will be referenced
  • standby
    specifies a text message to display while the object loads
  • tabindex
    indicates the order in the logical tabbing sequence for this object
  • type
    defines the MIME type for the object’s data
  • usemap
    defines a client-side image map for an image object element
  • vspace
    sets the amount of vertical space to appear above and below an image
  • width
    sets the object’s width

Previous / Next page

  1. Previous
  2. Next

Related reference material

  • embed
    provides a generic (non-standard) container for a media object
  • img
    specifies an inline image element

User-contributed notes

ID:
#4
Contributed:
by AutisticCuckoo
Date:
Fri, 28 Mar 2008 12:28:58 GMT

This section completely missed the point of the OBJECT element type, which is that it allows authors to provide a rich equivalent if the external object isn't supported. Compared with the measly ALT attribute of an image, there's a world of difference.

<h1>How to Make Coffee</h1>
<object type="video/mpeg" data="coffee.mpg">
<object type="image/png" data="coffee.png">
<ol>
<li>Fill the coffee kettle with water.</li>
<li>Heat the water until it starts boiling.</li>
<li>Add the ground coffee beans.</li>
<li>Let the brew simmer for a few moments.</li>
</ol>
</object>
</object>

Related Products