Attributes of the object and param

HTML <object> - embedding media

The <object> tag is used for embedding media contents (such as images, Java applets, Flash, movie, audio, or even another HTML file) on a web page.
The object element is partially supported in all major browsers, depend on the object inserted into HTML document.
If the object element is not displayed, the code between the <object> and </object> tags will be executed, so you can add an alternative text or an image.

This element is designed to include any sort of document. It uses the type attribute to indicate the "mime type", and the data attribute to indicate the source of the document (its URI).
If the browser (or one of its plugin) can interpret the embedded object, will download and play /run it, otherwise the nested content of the object is displayed.
Any HTML code can be inserted as an alternative content, for example a link to the document or an image.


Embed a PDF document

<object type="application/pdf" data="dir/html_course.pdf" width="300" height="200">
 <img src="dir/html_course.jpg" alt="HTML course" />
- Here the browser will show a PDF document if it supports the PDF format, otherwise it will show a JPG image (html_course.jpg).
The "width" and "height" attributes define the visible area of the object. The browser scale the object to these dimensions.

Embed an HTML file

<object type="text/html" data="dir/test.html" width="500" height="350">
  alt: <a href="dir/test.html" title="Test">test.html</a>
- If the browser can't use the object element to include an "text/html" file, will show the link added between the <object> and </object> tags (alt: test.html).

• The object element may also contain a number of param elements to define parameters or values for the object when it displays or plays.

Embed a SWF file

- This example includes a Flash game (in SWF format), and uses a <param> tag to define a background color for the area in which the game is displayed (set with the "width" and "height" attributes).
- Internet Explorer sometimes needs a <param> with a src parameter to understand the location.
<object type="application/x-shockwave-flash" data="games/cubilus.swf" width="500" height="250">
 <param name="src" value="html/l/cubilus.swf" />
 <param name="bgcolor" value="#fbfbfe" />
 Your browser not support SWF.
If the browser supports SWF application, will display the "cubilus" game, otherwise shows the text: "Your browser not support SWF."
Here is the result:
Your browser not support SWF.

Embend a WAV file

<object type="audio/x-wav" data="dir/test.wav" width="200" height="20">
  <param name="src" value="dir/test.wav" />
  <param name="autoplay" value="false" />
  <param name="autoStart" value="false" />
  Alt : <a href="dir/test.wav" title="WAV file">test.wav</a>
- Depending on the object, the major browsers use different codes to load the same object type. QuickTime understand the "autoplay" parameter. Windows media Player and Real Audio understand "autoStart" parameter.

Embendding audio MP3

<object type="audio/mpeg" data="audio/test.mp3" width="200" height="20">
 <param name="src" value="audio/test.mp3">
 <param name="autoplay" value="false" />
 <param name="autoStart" value="false" />
  Your system can't play audio/mpeg files.

Embendding MOV files

- For some types, like QuickTime document (MOV files), IE needs a non-standard value to the classid attribute, an identifier to load an associated activeX.
We can nest another object as an alternative content, for the other browsers that use the standard code:
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="" width="480" height="360">
  <param name="src" value="dir/">
  <param name="controller" value="true" />
  <param name="autoplay" value="false" />

  <object type="video/quicktime" data="dir/" width="480" height="360">
   <param name="controller" value="true" />
   <param name="autoplay" value="false" />
   You do not have QuickTime Player installed.

Attributes of the HTML object tag

The <object> tag supports the following attributes (along with: "id", "class", "style", "title"):

Attributes of the param tag

The <param> tag supports the following attributes:

Daily Test with Code Example

Which tag is used to add definition lists into a <dl> element?
<dt> <dd> <li>
  <dd> - Hyper Text Markup Language</dd>
  <dd> - Language for web pages</dd>
Which CSS property can hide an element on page, letting an empty space in its place?
display position visibility
#id {
  visibility: hidden;
Click on the event which is triggered when the mouse clicks on an object.
onclick onmouseover onfocus
document.getElementById("id").onclick = function(){
Indicate the PHP variable that contains the contents of both $_GET, $_POST, and $_COOKIE arrays.
if(isset($_REQUEST["id"])) {
  echo $_REQUEST["id"];
HTML object and param

Last accessed pages

  1. Ajax-PHP File Manager (3571)
  2. Area and Perimeter Calculator for 2D shapes (5794)
  3. Super Mario Crossover (506)
  4. Flash Games - Free online Games (13206)
  5. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (54372)

Popular pages this month

  1. Bubbles3 (3136)
  2. Butterfly Kyodai (2748)
  3. Zuma Deluxe (2025)
  4. Qwop (1252)
  5. Backgammon (1197)