The IFRAME Element | Inside JavaScript

The <IFRAME> Element

Iframes (inline floating frames ) are supported in Internet Explorer 4+ and Netscape Navigator 6 with the <IFRAME> element. These frames can "float," and need not just be aligned with the edges of a window. (In many ways, they are much like Netscape Navigator layers .) Here's an example using inline frames and the <IFRAME> element:

(Listing 07-14.html on the web site)

 <HTML>      <HEAD>          <TITLE>              Inline Frames!          </TITLE>      </HEAD>      <BODY>          <H1>Using the IFRAME Element</H1>          <BR>          <BR>  <IFRAME WIDTH="50%" HEIGHT="25%" NAME="frame1"   SRC="07-15.html" FRAMEBORDER="1" SCROLLING="NO" ALIGN="top">  <BR>          <BR>      </BODY>  </HTML>

(Listing 07-15.html on the web site)

 <HTML>      <HEAD>          <TITLE>              Inline Frames!          </TITLE>      </HEAD>      <BODY>          <H1>An Inline Frame</H1>      </BODY>  </HTML>

You can see the results in Figure 7.11, where we're creating an inline frame.

Figure 7.11. Creating an inline frame.

graphics/07fig11.gif

Like other HTML elements, <IFRAME> supports the JavaScript core HTML properties, methods , and events we saw in Chapters 5 and 6. You can see an overview of the additional properties of the <IFRAME> element in Table 7.8, and those properties in depth in Table 7.9. We'll see methods and events for this element in the next chapter.

Table 7.8. Overview of the Properties of the <IFRAME> Element (See Chapter 5 and 6 for the JavaScript core HTML properties, methods, and events that also apply to this element.)

Properties
`align`	`allowTransparency`	`contentDocument`
`contentWindow`	`frameBorder`	`frameSpacing`
`hspace`	`longDesc`	`marginHeight`
`marginWidth`	`scrolling`	`src`
`vspace`

Table 7.9. The Properties of the <IFRAME> Element (See Chapter 5 and 6 for the JavaScript core HTML properties, methods, and events that also apply to this element.)

Statement	NS2	NS6	IE4	IE5	IE5.5	IE6
`align`		x	x	x	x	x
	Read/write
	Sets the alignment of the iframe. Can be set to `"left"` (aligns to the left edge of the available space), `"center"` , (aligns to the center of the available space), or `"right"` (aligns to the right edge of the available space).
`allowTransparency`					x	x
	Read/write
	Specifies whether a frame can be transparent. When the property is set to false, the `backgroundColor` style property of the frame can only be that of the window. When the property is set to true, the `backgroundColor` property of the frame can be set to any value, including the default value of `transparent` .
`contentDocument`		x
	Read-only
	Holds the `document` object that corresponds to the content of the frame.
`contentWindow`					x	x
	Read-only
	Retrieves the `window` object of the specified frame.
`frameBorder`			x	x	x	x
	Read/write
	Specifies the value of the `FRAMEBORDER` attribute. May be set to "yes," "no," 1 (means yes), or 0 (means no).
`frameSpacing`			x	x	x	x
	Although this property has been included since IE4, it has no meaning for iframes. (Some programmers believe it was included as a mistake originally and since then has been kept for backward compatibility.)
`hspace`			x	x	x	x
	Read/write
	Corresponds to the `HSPACE` attribute; sets the horizontal space between the `<IFRAME>` and the surrounding content.
`longDesc`		x				x
	Read/write
	The property corresponds to the `LONGDESC` attribute, and holds the URL of a document with a long description of the frame.
`marginHeight`		x	x	x	x	x
	Read/write
	Holds the height of the margin between a frame's content and its frame, in pixels.
`marginWidth`		x	x	x	x	x
	Read/write
	Holds the width of the margin between a frame's content and its frame, in pixels.
`scrolling`		x	x	x	x	x
	Read/write
	Indicates whether the frame can be scrolled (and displays scrollbars if appropriate). May be set to "yes," "no," 1 (means yes), or 0 (means no).
`src`		x	x	x	x	x
	Read/write
	Enables you to set or read the `SRC` attribute of a frame, which sets the URL of the source document (as with images in the `<IMG>` element). Set to an URL.
`vspace`			x	x	x	x
	Read/write
	Corresponds to the `VSPACE` attribute; sets the vertical space between the `<IFRAME>` and the surrounding content.

And that completes our look at the properties of the window object, as well as our look at the <FRAMESET> , <FRAME> , and <IFRAME> elements. In the next chapter, I'll turn to the methods and events of the window object.