| | |
FRAMESET and FRAME behavior and appearance can be modified by several attributes, of which some are not consistently or reliably implemented. The most essential (and consistently implemented) attributes will be explained here; for more complete information on FRAMESET and FRAME attributes, see "HTML and XHTML: The Definitive Guide", Chapter 11.
By default, frames are resizable. In this example from an earlier section, try grabbing the frame edges and pulling them around; you should find that they move easily.
Most professional frame sites, however, have non-resizable frames, like the ones in this example. Notice how THESE frames refuse to resize?
Non-resizable frames are created by adding the NORESIZE attribute to every FRAME tag that you wish to make non-resizable.
Tag: FRAME
Attribute: NORESIZE
Value: none (in XHTML syntax, every attribute must have a value. In cases where there is no value, then, the value would be a restatement of the attribute name itself, i.e. noresize="noresize"
Description: the NORESIZE attribute prevents a given FRAME from being resizable.
Example (use this syntax for now):
<frame src="./myPage.html" noresize />
Example (following strict XHTML syntax -- don't use the strict syntax yet):
<frame src="./myPage.html" noresize="noresize" />
By default, frames automatically decide for themselves whether they need scrollbars or not. If the dimensions of the contents of a frame exceed the size of the frame, scrollbars appear. If the contents of a frame are smaller than the frame, scrollbars do NOT appear.
Regardless of the size of the contents of a frame, you may force scrollbars ALWAYS to appear or you may force scrollbars NEVER to appear, by using the SCROLLING attribute of the FRAME tag.
Tag: FRAME
Attribute: SCROLLING
Value: auto (default), yes, no
Description: use the SCROLLING attribute to force a frame always to have scrollbars (scrolling="yes"scrolling="no"
Example:
<frame src="./myPage.html" scrolling="yes" />
The above frame will ALWAYS have visible scrollbars, even if they are not active. This might be useful if you have a design in which you wish always to see the scrollbars (something I myself have occasionally required).
Example:
<frame src="./myPage.html" scrolling="no" />
The above frame will NEVER have scrollbars, even if they are required. This might be useful if you have content of a frame that PRECISELY fills the frame right to the edge, which might otherwise trigger the scrollbars to appear unnecessarily.
Warning: Turn off a frame's scrollbars with great caution. Make CERTAIN that the content of your frame is visible even to users on the SMALLEST monitors before you turn off a frame's scrolling capability; I've had students who have created final projects with a non-scrolling frame containing beautiful navigation graphics which disappeared right off the edge of the browser window, disabling the navigation and crippling the site. I would test the design on both Mac and PC at 640x480 screen resolution before turning off the scrolling, if I were you!
While it is possible to create THICKER borders on frames, designers are usually more interested in creating BORDERLESS frames. Thick borders on frames are relatively ugly and their appearance is difficult to control precisely cross-browser, whereas borderless frames look the same everywhere and are extremely fashionable.
To create borderless frames, you must set THREE attributes of the main FRAMESET tag for the page equal to 0: BORDER, FRAMESPACING, and FRAMEBORDER. You only need to set these attributes for the primary FRAMESET tag; nested FRAMESET tags may be left alone.
Example:
<html>
<head>
<title>Borderless Frame Example</title>
</head>
<frameset cols="*,200" border="0" framespacing="0" frameborder="0">
<frameset cols="150,*">
<frame src="./page1.html" />
<frame src="./page2.html" />
</frameset>
<frame src="./page3.html" />
</frameset>
</html>
To see borderless frames in action, I have revised the first example from this module to use borderless frames. Cool, huh? Well, OK, it's a little short on design sensibility, but you get the picture.
Why do you need to set all THREE of these attributes to zero, did I hear you ask? Did I hear you say that you got borderless frames to work with only one, or maybe two, of these attributes? To make a long story short, each of the major browsers requires some combination of one, two, or all three of these attributes in order to consistently display true borderless frames. I'm not going to go into details; it's confusing and pointless, with no general rule by browser or platform, varying from version to version. Suffice it to say that if a browser DOESN'T need one or more of these three attributes, it will ignore what it doesn't need, but at least one recent browser version on the PC requires all three attributes together!
 |
 |
Copyright © 2001 Michael Masumoto. All Rights Reserved.