I have an iframe in the middle of my page, and I would like users to be able to maximize it to better see the content within. This is being done with the following Javascript functions:
Code:
//note: the iframe I am maximizing has ID "preview". The elements with IDs "flash_movie", "ext_links", and "headlines" are things that will be covered by the maximized iframe. "topmenu" and "menuitems" are things that are moved to just above the maximized iframe, so that they can stay in view.
function maximizeStoryContainer()
{
document.getElementById("flash_movie").style.visibility = "hidden";
document.getElementById("ext_links").style.visibility = "hidden";
document.getElementById("headlines").style.visibility = "hidden";
document.getElementById("topmenu").style.top = "1%";
document.getElementById("menuitems").style.top = "5%";
var preview = document.getElementById("preview");
preview.style.visibility = "hidden";
preview.style.top = "9%";
preview.style.height = "89%";
preview.style.left = "1%";
preview.style.width = "96%";
preview.style.visibility = "visible";
}
function restoreStoryContainer()
{
var preview = document.getElementById("preview");
preview.style.visibility = "hidden";
preview.style.top = "33%";
preview.style.height = "67%";
preview.style.left = "20%";
preview.style.width = "53%";
preview.style.visibility = "visible";
document.getElementById("topmenu").style.top = "25%";
document.getElementById("menuitems").style.top = "29%";
document.getElementById("flash_movie").style.visibility = "visible";
document.getElementById("ext_links").style.visibility = "visible";
document.getElementById("headlines").style.visibility = "visible";
}
page is here: [link]
http://www.geocities.com/your_sports_source/index.html[/link]
the problem only occurs when another page is loaded in the middle iframe. test this by mousing over the MLB in the menu, and clicking on "standings".