Ken Ward's Java Script Tutorial ...

Frames in Java Script

This page deals with loading pages in their proper parent, the frame buster code, and loading orphan pages in their proper frames.

Bursting out of frames

The frame buster code was written some years ago, and I claim some originality in these two or three liners, even the name "frame buster" seems to have taken root!

Have you ever visited a page, pressed a link and found that the new page from a different site is stuck in the other guy's frame? If the new page is a frames page, then this is fun with more and more frames filling up your screen. To avoid annoying the user with this, you can make your pages burst out of frames.

Frames example

You can avoid this fate befalling your pages with the following code in the file loaded by your frame page:

if (top !=self.parent)

That is, the file says: "if my parent (self.parent) isn't at the top, then let the top location be my parent's location." I put this code into a function in the head of the page:


function FrameBuster(){

if (top!=self.parent)


} // --> </script>

And loaded it from the BODY of the file:

<BODY ONLOAD="FrameBuster()">

The above code is better placed in one of the files that your frame always loads, if possible. In this case, I put the code in the sidebar file.

When you have loaded the frame which breaks out of the master frame, there is another link to a file that breaks out of all frames. This one has the code:

if (top !=self)

In this case, it is saying: "If I am not the top file, then make me the top file." And all frames are unloaded!

When we are linked to other sites, there is the real danger that these will grab our pages, and annoy the surfer by filling his or her browser with frames. We can use the above code to break out of frames. Of course, if we were loading files, then we could load the new file in the top position using the HTML TARGET method:

<a href="MyFile" TARGET="_top">

But when the surfer comes to our site from another, we have no control over this. Java Script, however, comes to the rescue!

Normally, it is hard to see how the two targets _top and _parent differ. The above shows how they are different under some circumstances!

Loading Orphan Frame Pages in their Parent

Sometimes a page that belongs to a frame, is registered with search engines, and when the searcher loads that page, it is without any navigation - all dressed up and nowhere to go!

You can load a page into its parent code using the following:

<script type="javascript">


function framer()


if (top.location==self.location)


answer=confirm('I am supposed to be part of a frame.\n '+

'So I am going to load in my frame.\n Please find me in the frame navigation')

if (answer!=0)


//top.location is the name of the frame page





The above code is put in the head of the document. It is called in the body tag:

<body onload="framer()">


Let's look at our hyperlinks in frames!