Andy Fish wrote:
Hi
I have hunted around for this one but been unable to find any
definitive answer.
I have a simple frameset with one frame above another. by clicking a
checkbox or some such in the lower frame the user can choose whether
to have the upper frame displayed or not.
I have tried frames["upper"].style.display="none" which looked right
according to the CSS spec but didn't work for me.
I don't want to have to reload the page without a frameset; I want to
keep the frameset in place but the lower frame fills the window and the
user cannot see or navigate to the upper frame. This should work in recent
versions of popular browsers (mandatory IE6 and Firefox)
Can this be done?
TIA
Andy
Remembered this from years past but, no idea how cross-browser it is.
Check it out if you like...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/str***ict.dtd">
<html>
<head>
<title>untitled</title>
<style type="text/css">
</style>
<script type="text/javascript">
function upperF()
{
return [
'<html><head></head>',
'<body style="background:coral;"',
'><h2>upper</h2></body>',
'</html>'].join('');
}
function lowerF()
{
return [
'<html><head></head>',
'<body style="background:moccasin;"',
'><h2>lower</h2><input type="checkbox" ',
'onclick="top.toggleUpper(this.checked)">',
' <span id="hs">hide</span> upper',
'</body></html>'].join('');
}
function toggleUpper(bWhich)
{
document.body.rows =
(bWhich) ? '0,*' : '20%,*';
lower.document.getElementById('hs').innerHTML =
(bWhich) ? 'show' : 'hide';
}
</script>
</head>
<frameset rows="20%,*">
<frame name="upper" src="javascript
:top.upperF()">
<frame name="lower" src="javascript
:top.lowerF()">
</frameset>
</html>
The relevant code is in toggleUpper, the rest is just for putting
everything in one file. hth