LIS 523 - Frames

According to SecuritySpace (April, 2007), about 14% of Web sites use frames. Many Web designers now deprecate the use of frames, and their use seems to be in decline.

To use frames, you need a special HTML page to contain frameset and /frameset tags in place of the usual body and /body tags. In addition, you will need HTML pages or other files to display in the frames and/or scripts to generate content for the frames.

The frameset tag must have either a rows attribute or a cols attribute or both; the values of these attributes should be comma-delimited lists of widths/heights of the areas to be occupied by the frames; the default unit is pixels, but percentages are often more useful.

Between the frameset tag and the /frameset tag, one or more frame elements are inserted. A frame tag will usually have at least a name attribute. If you want something displayed initially in the frame, the frame tag should also have a src attribute. A frame for which there is no room, given the rows and cols values of the frameset, will not be displayed.

In addition to the frame tags, you can insert other HTML code providing information for anyone using a browser that does not support frames. A browser that does support frames will just ignore this code.

Here is a simple example:

    <title>LIS 523/5 - Frames</title>
    <frameset cols="70%,20%">
    <frame src="525fra.htm" name="leftFrame">
    <frame name="rightFrame" src="about:blank">
    This page uses frames,
    which your browser does not support.
    <a href="525fra.htm">Show just the information page</a>.
    (Frame demonstrations will not work.)

When designing framesets, note that refreshing or reloading the page in the browser does not update the frameset, but just the individual frame contents. If you modify the frameset (say, by changing columns to rows), you need to request the page again explicitly by URL or by opening it as a file.

Using Hyperlinks to Change Frame Contents

Clicking on a simple hyperlink to another URL within a frame results in the corresponding file's being rendered in the frame.

If this is not desirable, the form of the link can be changed by providing an appropriate value for the target attribute. If target is set to "_parent", clicking on the link replaces the whole frameset with a rendering of the new file. If target is set to "_top", clicking on the link replaces the entire browser window contents with a rendering of the new file. This is how the links at the bottom of this page work. If target equals "_blank", another window will be opened for the new file.

The value of target may also be the name of a frame. For example, the following link loads the instructor's home page into the righthand frame: Tim Craven.

Using Scripting to Change Frame Contents

Although you can use scripting just to load different files into a frame, the real strength of scripts is in providing dynamic content by creating HTML code on the fly. The following code illustrates how this can be done:
    <script language="JavaScript1.1">
    <!-- JavaScript begins...
    function writeFrame() {"text/html", "replace")
    // JavaScript ends -->
You need to be careful, however, not to apply this sort of code to a frame which might display an actual file: if the frame is displaying a file, Internet Explorer will generate an "Access is denied" error instead of executing the script, and Opera 8 or 9 will halt the script on a "Security violation" error. (Interestingly, the opposite appears to have been the case in Opera 5: the frame had to be displaying an actual file for its name to be recognized. Opera 7 did nothing at all regardless of the previous state of the frame.) Try the results by clicking on the button below:

For more complex examples that make use of this sort of dynamic frame filling, see the quizzes in the Thesaurus Construction Tutorial.


Last updated April 20, 2007.
This page maintained by Prof. Tim Craven
E-mail (text/plain only):
Faculty of Information and Media Studies
University of Western Ontario,
London, Ontario
Canada, N6A 5B7