View Full Version : Drop Down Menu modifying a iFrame

02-26-2007, 06:15 PM
Right, so i have been searching for this for ages and cant seem to find it anywhere
I can create links to modify a iFrame

<html xmlns="http://www.w3.org/1999/xhtml">
<SCRIPT language=javascript type="text/javascript">
var iFrameArray = ["iframe1","iframe2","iframe3"];
function showhideiframe(strIframeID){
document.getElementById(strIframeID).style.display = "block";

function hideAllIFrames(){
for(var i=0; i<iFrameArray.length; i++){
document.getElementById(iFrameArray[i]).style.display = "none";

<div style="clear:both;">
<A HREF="" onClick="showhideiframe('iframe1'); return false;">iFrame1</a>
<A HREF="" onClick="showhideiframe('iframe2'); return false;">iFrame2</a>
<A HREF="" onClick="showhideiframe('iframe3'); return false;">iFrame3</a>


<iframe name="iframe1" id="iframe1" src="PAGE GOES HERE" frameborder="0" width="100%" height="100%" style="display:block" ></iframe>
<iframe name="iframe2" id="iframe2" src="PAGE GOES HERE" frameborder="0" width="100%" height="100%" style="display:none" ></iframe>
<iframe name="iframe3" id="iframe3" src="PAGE GOES HERE" frameborder="0" width="100%" height="100%" style="display:none"></iframe>


But i dont really want to click on a link to change the iFrame... is it possible to change this to a Dropdown Menu?

Any help would be greatly appreciated


02-26-2007, 09:17 PM
You have a good solution there, though, I wouldn't load more than one IFrame. Basically, I would use one IFrame to load contents relevant to a link. In other words, the function you have created should change the source of the IFrame instead of modifying CSS properties.

Here are a couple of references you could use to achieve what I have explained above.