Nested Framesets

Picture of the recipes page Let's move now to a more real world example, and a few more techniques for using frames. One of the most popular uses for frames is the "title bar and side menu" method. We'll use as an example a page of recipes, pictured at right. The title of the page, "Great Recipes" stays stationary in a frame at top, a contents list is on the left, and the recipes themselves are in the large box on the right. As you click on the name of a recipe in the contents list, that recipe appears on the right. Go ahead and try out the real page. (We're sorry if these recipes make you hungry. They did us. These recipes come from the wonderful vegetarian recipe site Veggies Unite!.)

Remember that a frameset is like a "table of documents" with rows and columns. The recipes page, however, has one column on top, but two on bottom. This is done by nesting framesets, putting one frameset inside another.

Here's the code for the frameset file for the recipes page:

<TITLE>Great Recipes</TITLE>
<FRAME SRC="recipetitlebar.html" NAME=TITLE SCROLLING=NO>
<FRAME SRC="recipesidebar.html" NAME=SIDEBAR>
<FRAME SRC="recipes.html" NAME=RECIPES>
<H1>Great Recipes</H1>
No frames? No Problem! Take a look at our 
<A HREF="recipes.html">no-frames</A> version.

Frames within frames
frameset within frameset
The first <FRAMESET ...> tag says "this frameset will have two rows" (and, implicitly, only one column, since COLS was left out). The first <FRAME ...> tag puts a document in the first frame. The second frame is filled in not by a document but by another frameset. The second <FRAMESET ...> is creating a "table within a table", or, to be more correct, a frameset within a frameset.

About the Author
Copyright 1997-2002 Idocs Inc. Content in this guide is offered freely to the public under the terms of the Open Content License and the Open Publication License. Contents may be redistributed or republished freely under these terms so long as credit to the original creator and contributors is maintained.