FRAMES
Reference Page
Frames are a set of html pages arranged in a browser window by a "controlling" html page which is not seen, but is the actual page that needs to be loaded (ie, bookmarks and links must use the address of the controlling page). The controlling page does not have a body and is set up like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head><title>Page title</title></head>
</html>
Main tags for Frames in the controlling page:
- <frameset></frameset> (container tag identifying the frame structure)
- <frame> (simple tag identifying a frame window and its contents)
Simple frame with two columns:
|
<frameset cols="200,*"> |
Indicates the frame uses columns, that the first column is 200 pixels wide, and the second one takes up the remainder |
<frame src="left.html" name="left">
<frame src="right.html" name="right">
| Sets up the two windows in the frame, says what html file goes in each to begin with, and names the windows |
|
</frameset> | Ends the frameset
|
Simple frame with two rows:
|
|
<frameset rows="200,*"> |
Indicates the frame uses rows, that the top row is 200 pixels high, and the second one takes up the remainder |
<frame src="top.html" name="top">
<frame src="bottom.html" name="bottom">
| Sets up the two windows in the frame, says what html file goes in each to begin with, and names the windows |
|
</frameset> | Ends the frameset
|
Complex frame with two columns, with the second column having two rows:
|
|
<frameset cols="250,*"> |
Indicates the frame starts with columns, that the left column is 250 pixels wide, and the second one takes up the remainder |
|
<frame src="menu.html" name="menu"> | Sets up the first window on the left |
<frameset rows="150,*"> |
Indicates that the second column is made up of two rows, that the top one is 150 pixels high, and the bottom one uses the remainder |
<frame src="title.html" name="title">
<frame src="content.html" name="content">
| Sets up the two windows in the right column |
|
</frameset> | Ends the rows frameset
|
|
</frameset> | Ends the columns frameset
|
|
Attributes which can be used in the <frameset> tag: |
cols="20%,30%,50%"
rows="20%,30%,50%"
| Indicates in a general way how to size the windows (should add up to 100%) |
cols="200,*"
rows="80,150,*"
|
Specifies a specific width or height in pixels. When using this, one of the items should be represented with an asterisk (*) to allow using up the remaining space.
|
| frameborder="0" | Eliminates the separator between frame windows. Default is "1". |
| Attributes which can be used in the <frame> tag: |
|
src="filename.html"
| Indicates the source page to go in that frame to begin with (can also be an image). |
|
name="windowname" |
Names the window of the frame -- important for loading other content into that frame window -- this is the name you would use with target="windowname" to have a link load into the frame window. |
|
scrolling="no" | Options are "yes" "no" "auto" -- This indicates whether to put a scroll bar on the window. Default is auto, which means that a scroll bar will be put on if needed to see the rest of the content. "no" means that no scroll bar will be placed regardless of whether one is needed (use with caution). "yes" means a scroll bar will be put up regardless. |
|
noresize | This means that the viewer will not be allowed to resize the window. |
marginwidth="1"
marginheight="1" | Indicates the spacing from the edge of the frame to the content. Minimum is 1, but browsers automatically put more than 1 in there, so if you're having problems getting your logo to fit, add the marginwidth and marginheight of 1. |
Remember: put all the attributes for a tag within the same tag. eg:
<frameset cols="200,*" border=0>
<frame src="file.html" name="window" noresize scroll="no" marginwidth="1" marginheight="1">
TARGETS
Be very careful to assign targets to all your links or you could end up with pages popping up in the wrong place.
Format:
<a href="http://www.website.com" target="name">
What names to use?
- If you use a name which you established in the <frame> tag, then the link will open up in that frame window
- if you use name="_top" (note the underscore), then the link will fill the current browser window, eliminating the frames.
- if you use a name that hasn't already been established, then the link will open up in a new browser window (you can use any name you wish).
What if you have a lot of links on a page (like a links page)?
- You can use the following code on your page (this gets placed WITHIN the <head> tag:
Then, every link on that page will go to that target, unless you specify differently.
NOFRAMES
If you're concerned that people with browsers that don't support frames may be viewing your pages, you can help them out as well.
On the "controlling" page, put the following in right after your final </frameset>:
<noframes>
Put the information you want them to see here. It may be a basic index of links without frames, or a message, or...
</body>
</noframes>
The information you put in there will only be seen on browsers that don't support frames (very few these days). It will be ignored by any other browsers.
You can reach Pete at:
pete@thelivingcanvas.com
|