Welcome to the MacNN Forums.

MrBS · May 3, 2002, 07:08 AM

I've been trying to find information on loading all frames when one frame is opened. I think I could do this in JavaScript, but I'm not sure how to test if the frames are already loaded.
Basically I want to be able to have a link to something other than the main frameset and not lose the functionality of the navigation frames. And I don't want to define a new frameset for every permutation of all the frames. Any suggestions? Can you point me towards a resource? Anyone written something similar I could use to get started?
Thanks,
~BS

MrBS · May 5, 2002, 04:41 AM

<bump>
anyone?

peterthorn · May 16, 2002, 07:26 AM

I believe that if you put this into the body of all the documents, it should do the trick (and if you want to reload more frames, just repeat with the proper changes). Please note that I had to divide the onloading command into two words, otherwise I wasn't allowed to post it - but it should of course be in one word.

Good luck,
Peter

<snip>

on load="parent.frames.the_name_of_the_frame_to_be_re loaded.document.location.reload();

</snip>

Simon Mundy · May 20, 2002, 07:35 PM

DISCLAIMER: I hate frames, and I don't endorse using them.

There, said it.

But on several occasions, I've had to use them due to plain stubbornness on the client's side. So I've come across a reasonably trouble-free solution to this. I say 'reasonably' because small issues like 'how do I link directly to a page' comes up, and you have to do a lot of jumping through hoops to get THAT to work. Sigh.

But here goes! Start with a 3 panel frameset like so:

<BLOCKQUOTE>code:<HR><pre>�!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"�

�html�

�head�
�meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"�
�script type="text/javascript" language="javascript"��!--

function loadURL() {
page = document.location.search;
if (page) { top.body.location.replace('/pages/'+page.slice(1)); }
}

// --��/script�
�/head�

�frameset border="0" framespacing="0" rows="57,*" frameborder="no" on-load="loadURL()"�
�frame name="header" src="(your header).html" scrolling="no" marginwidth="0" marginheight="0" frameborder="no" border="0" noresize�
�frameset cols="120,*" border="0" framespacing="0" frameborder="no"�
�frame name="panel" src="(your left panel).html" scrolling="no" marginwidth="0" marginheight="0" noresize�
�frame src="(your content).html" name="body" noresize�
�/frameset�
�/frameset�

�body�You need frames, blah, blah...
�/body�

�/html�[/code]

Notice the Javascript - you'll need that in order to link directly to pages within the site. Also note the names of the three frames - 'header', 'panel', and 'body'.

OK, now you'll need to create all the unique header pages. Say you had 6 sections within the site. Name your headers in a way that's easy to remember ('header-01', 'header-02', etc..) and make sure that's the title of each page (�title�header-01�/title�).

Do the same for all the side panels - (e.g. ('panel-01-01', 'panel-01-02', 'panel-02-01', etc...) - just make sure you can remember which panel belongs to which section.

Now, for each of the content pages, you need to add a javascript to the �head� section. It could be embedded or linked to an external file. The code is:

<BLOCKQUOTE>code:<HR><pre>
var defaultLocation = "http://your-site/your-page.html";

function checkmenu() {

if (!top.window.frames.length||!t op.window.frames['header']||!top.window.frames['left']) {

top.location.href = defaultLocation;
return false;
}

else {

if (top.panel.document.title != checkmenu.arguments[1] && checkmenu.arguments[1] != null) {top.panel.location.replace(checkmenu.arguments[1] + '.html');}
if (top.header.document.title != checkmenu.arguments[0] && checkmenu.arguments[0] != null) {top.header.location.replace(checkmenu.arguments[0] + '.html');}
return true;
}
}
[/code]

The first part of the code checks to see if the frameset is loaded and the correct frame names are present. If not, it should take you to the correct html page with the frameset code.

The second part then checks to see how many values you've passed to the function - if it's one, then only check the 'header' frame, or two then check both the 'header' and the 'panel' frames.

The last thing you need to do is add the 'on-load' condition to your body tag:

<BLOCKQUOTE>code:<HR><pre>�body .... on-load="checkmenu('header-01','panel-01-02');"�[/code]

Replace the two parameters with the titles of the two frames you want to sync with.

Voila! Now whenever a page loads in the content frame, it will automatically check the top and left frames to make sure they are loaded as well.

The downside to this method? Lots of hard work and - potentially - incompatibility with older browsers, and browsers which have javascript disabled.

Use this as a quick'n'dirty fix, or if you feel inclined, improve on this code and send it back to me to show how it can be done better. I'd appreciate it!

NOTE: Because of UBB's poor HTML display, I've changes the < and > to � and �. Also, you may need to change '.html' to whatever suffix is best for your server. Also, UBB wouldn't let me put 'on-load' as one word - just remove the dash.