Ken Ward's Java Script Tutorial ...

Loading orphan frames in their proper parent!

In the previous lesson, part of a frame was the file, named 1stRight.htm. Sometimes search engines will find pages which are part of frames and they are rather lost orphans. Try this link to load 1stRight.htm and see what happens. Using IE 4 and Nav 4 I get a message that the file is going to get inside it's parent. And when I click OK, the parent loads. The code involves two parts. One part in the HEAD of the document and the initialising part in the BODY tag.

Here is the code for the HEAD:

<script LANGUAGE="JavaScript">

<!--//

function framer()

{

if (top.location==self.location)

{

alert('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')

top.location="FramesHyperlinks2.htm"

}

}

//-->

</script>

The code starts off saying:

if (top.location==self.location)

That is, if the top location in the browser is me (self.location) then it does an alert. After the alert, it applies this code:

top.location="FramesHyperlinks2.htm"

This code simply tells the browser to load the frames page in the top location. If the page doesn't exist, then the promise of the alert is not fulfilled, the code does nothing. Otherwise, the parent frame page is loaded. If this holds many pages, then the user has to search for the page through the navigation. This is probably preferable to having an orphan file that goes nowhere and doesn't work properly.

The activating code is in the BODY tag. It is:

<body background="backg2.gif" bgcolor="white" onLoad="framer()">

The onLoad event calls the function we have created in the HEAD of the document. So when the page loads, it activates the code.

Unfortunately, we cannot do an onLoad event to load the orphan it the frame, because when the main frames page loads, so will the orphan, and the onLoad event will trigger again, and again, and so on into the vast reaches of infinity! So, if we don't want our orphans left all alone, then we might prefer this code!

 


[If you need to learn more about HTML visit the HTML Tutorial]