This article is about dynamic frame resizing, this way you can change the frameset without reoading it. It can be used to show/hide a navigation bar or any other frame you can think of.


The first thing you'll have to do is to assign the frameset tags a name this is done by including id=name in the frameset tag, of curse you'll have to replace name with the name you want the frameset to have, remember that you'll have to use different names for all frameset tags if there's more then one.

It could look something like this.

<frameset id=frameset1 cols="160,*" frameborder="0" framespacing="0">


Now you'll have to make a JavaScript that makes the changes to the frameset,this is done by using parent.name.cols or parent.name.rows depending on if you want to change the rows or the cols.

function Frame($1) {
	if ($1 == "Show") { FrameSize = "160,*" }
	if ($1 == "Hide") { FrameSize = "0,*" }
	parent.frameset1.cols = FrameSize;
}


Now you'll need a to make it so that the user can show/hide the frame by clicking a link, this is done by specifying the name of the function Frame and Hide or Show in the anchor. You could also use a div or a image to do this.

<a href="JavaScript:Frame('Hide')">Hide</a>
<a href="JavaScript:Frame('Show')">Show</a>

Lets say you would only want one link to toggle between show and hide, then you would use a anchor tag like this one <a href="JavaScript:Frame()"></a> and a JavaScript like the one below.

function Frame() {
    if (FrameStat == "Show") {
        FrameSize = "160,29,*";
        FrameStat = "Hide";
    }
    else {
        FrameSize = "0,29,*";
        FrameStat = "Show";
    }
    parent.FS1.cols = FrameSize;
}
onLoad=FrameStat="Hide";


That's all for now, I'll add the code to resize it more smoothly shortly...

Author: Emil A Eklund