Hi
I'm trying to have a website that hosts different applications (also websites) in iframes. Note: only one application is active (displayed) at a time. My problem is that links that rely on targets are loaded in the wrong iframe (the first that is found).
To avoid problem with links that rely on a specific target, the script changes the attribute 'name' of hidden iframes to something else and rename the current iframe to the correct name/target.
But when I click on a link, the site loads in the wrong frame.
To clarify my problem check out the following code. There are links to activate one of three iframes (the other two are hidden). When the user clicks on the sourceforge link, the page should be loaded into the active iframe (the one that is displayed at the time), but it is loaded into the first (ms) iframe.
Is there a way to fix this?
Using Firefox 3.6.11/Windows 7
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function activate(n){
var iframes = document.getElementsByTagName('iframe');
for(var i = 0; i < iframes.length; i++){
var f = iframes[i];
f.style.display = 'none';
f.name = 'hidden-'+i;
}
document.getElementById('target'+n).style.display = 'inline';
document.getElementById('target'+n).name = 'target';
}
</script>
</head>
<body>
<h1>Willkommen</h1>
<a href="http://sourceforge.net/" target="target">Load Sourceforge in current frame</a>
<br/>
<a href="javascript:activate(1);">MICROSOFT</a>
<a href="javascript:activate(2);">GOOGLE</a>
<a href="javascript:activate(3);">ORACLE</a>
<iframe id="target1" src="http://www.microsoft.com/" name="target" width="100%" height="400px">noframes</iframe>
<iframe style="display:none;" id="target2" src="http://www.google.com/" name="hidden-1" width="100%" height="400px">noframes</iframe>
<iframe style="display:none;" id="target3" src="http://www.oracle.com/" name="hidden-2" width="100%" height="420px">noframes</iframe>
</body>
</html>