You are here: irt.org | FAQ | JavaScript | Frame | Q173 [ previous next ]
This is really dependent on the implementation of frames by the various browsers. There have IIRC been subtle changes to the way frames are handled by the browsers history object.
Generally speaking if you click back then the last frame to change goes back one in its history.
The only way you can achieve what you require is to have an onLoad function in the frames that makes sure the right document is loaded in the other frame. This way the frames are kept in step.
However, if you ever need the frames to be out of step this will not help you.
This approach can however get messy, so I have utilised the locations replace() method for those browsers that support it.
frame.html:
<FRAMESET ROWS="50%,50%">
<FRAME SRC="frameA.html" NAME="frameI" FRAMEBORDER=0 BORDER=0>
<FRAME SRC="frameB.html" NAME="frameJ" FRAMEBORDER=0 BORDER=0>
</FRAMESET>frameA.html:
<H1>frameA</H1>
frameB.html:
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript"><!--
function changeframes() {
parent.frameA.location.href = 'frameC.html';
parent.frameB.location.href = 'frameD.html';
}
function checkframes() {
if (parent.frameA.location.href.indexOf('frameA.html') < 1)
if (document.images)
parent.frameA.location.replace('http://www.somewhere.com/frameA.html');
else
parent.frameA.location.href = 'frameA.html';
}
//--></SCRIPT>
</HEAD>
<BODY onLoad="checkframes()">
<H1>frameB</H1>
<FORM>
<INPUT TYPE="BUTTON" VALUE="Change Frames" onClick="changeframes()">
</FORM>
</BODY>
</HTML>Note: in Opera replace() will work, but only with absolute URL's.
frameC.html:
<H1>frameC</H1>
frameD.html:
<H1>frameD</H1>