Rami Arieli: "The Laser Adventure" Articl1 Page 7
File Examples

The code in box 1 is a complete lesson-page frameset file.

Note that the <frameset> container tags replace the standard <body> tags. They tell the browser that the following instructions state how to divide the browser window into frames.

Frameset tags may be nested so as to divide the window into any combination of vertical (column) and horizontal (row) frames.

The frameset tag in Box1 divides the window into two vertical columns and tells the browser to create the two columns in the remaining undivided portion of the window, which in this case that is the entire window.

<Box 1>

<html>
<head><title>Rami Arieli: &quot; The Laser Adventure &quot;</title></head>
<frameset cols="15%,*" frameborder=1>
<frame src="N1p2.htm" name="left">
<frame src="C1p2.htm" name="main">
</frameset>
</html>

The instruction “cols=15%,*” defines the first column to be 15% of the window and the second column to be the remaining portion of the window.

To divide the window into horizontal rows, substitute the word “rows=“ for “cols=“.

The order of the division is left to right for columns and top to bottom for rows.

The src (source) attribute of the <frame> tag tells the browser the name of the document to display in the frame. In the example, a navigation bar is displayed in the left column and a lesson content page is displayed in the right.

The name attribute is a way to name an individual frame so that other HTML statements may control its content.

If the user selects a hypertext link in a lesson page that displays a word definition from the glossary, the browser must know which frame is the “target” for that document. That is accomplished by including the target attribute in the links anchor tag. For instance, this anchor tag will display Glossary.htm in the lesson-content (right) frame:

<a href=“../Glossary/Glossary.htm” target=“main”>.

Note that the right frame is named “main” by the use of the name attribute in the <frame> tag.

To subdivide one of the rows or columns into frames, substitute another set of <frameset> tags for the <frame> tag corresponding to that row or column.

The code in the Box 2 will subdivide the left column into two equal-height rows leaving the right column as it was.

<Box 2>

<frameset cols=“20%,*” frameborder=0>
<frameset rows=“50%,*” frameborder=1>
<frame src=“frame1.htm” name=“upper_left”>
<frame src=“frame2.htm” name=“lower_left”>
</frameset>
<frame src=“frame3.htm” name=“main”>
</frameset>