Frames Tutorial part 4

Using JavaScript

Suppose you want to change the text or links on a page depending on whether it is displayed inside of a frameset or by itself. This is fairly easy to do with JavaScript.

Changing Text

Let's start with a simple example. Suppose you want to display a sentence that tells your visitor to use the menu on the left if the page is part of a frameset, but to do nothing if it is a separate page. 
My cat likes to push her toys under the kitchen door.
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!-- Hide script from old browsers
if (top.location != self.location)
{
document.write('Click on the link in the menu on the left');
document.write(' to see for yourself.');
}
// End script hiding from old browsers -->
</SCRIPT>
I will not get into the details of JavaScript. In general, you write your HTML code the way you normally would, then put
document.write('
in front of it and
');
after it.

The line
if (top.location != self.location)
causes the block of code to be run only if the page is being displayed in a frameset. In this case, the final page will say:

My cat likes to push her toys under the kitchen door. Click on the link in the menu on the left to see for yourself.

Of course there is no reason to add this code unless it is possible for the page to be viewed both inside of a frameset and also as a separate page. You can also provide non-framed text by adding an else clause.

Automatic Relay

A menu page should not be displayed by itself, because it simply doesn't make sense to do that. The code below is taken from the first example's menu: 
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!-- Hide script from old browsers
if (top.location == self.location)
{
document.write('<P><B>This page is part of a framed page');
document.write(' and is not intended to be viewed by itself.');
document.write('<BR>You will be automatically taken to');
document.write(' <A HREF="framefrm.html">framefrm.html<\/A>');
document.write(' in just a moment.<\/B><P>');
setTimeout('location = "framefrm.html"', 5000);
}
// End script hiding from old browsers -->
</SCRIPT>

This time we use
if (top.location == self.location)
because we want the block of code to be run only if the page is NOT being displayed in a frameset. The HTML it generates will add this text to the page:

This page is part of a framed page and is not intended to be viewed by itself.
You will be automatically taken to framefrm.html in just a moment.

The line
setTimeout('location = "framefrm.html"', 5000);
will cause the page framefrm.html to be automatically displayed after 5 seconds. The delay is to give your visitor time to read the message before it disappears. It is a good idea to give them a link to click on in case this does not work properly.

Breakout

You will often see pages with a link that says something like Click here to break out of frames. You can use the above technique to display the link only if the page is in fact in a frameset. The way you break out of frames is to redisplay the page with the special TARGET name _top. 
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!-- Hide script from old browsers
if (top.location != self.location)
{
document.write('<A HREF="thispage.html" TARGET="_top">Break out of frames<\/A>');
}
// End script hiding from old browsers -->
</SCRIPT>
< Back to Targets and Menus   On to Additional Info >  
1