[RESOLVED] Dynamic update an IFRAME problem

[AllanJP]

Hi all,

My problem is:

I'm trying to create a website where, when you hover a link (onmouseover) then a different content is shown in an IFRAME? e.g.
...
...
...
<a href="#" class="dark" onmouseover="mouseover('front.htm');" onmouseout="mouseout('default.htm');">About Us</a>
...
...
...
<div>
<script type="text/javascript">
function mouseover(txt)
{
document.write('<iframe src ="' + txt +'" width="100%" height="500" scrolling="no" frameborder="0"></iframe>');

}

function mouseout(txt1)
{
document.write('<iframe src ="' + txt1 +'" width="100%" height="500" scrolling="no" frameborder="0"></iframe>');
}
</script>
</div>
...
...
...

but all this does is read in the IFRAME on the entire page and not as intended only in the <div> section... I'm not an experienced web programmer, I'm a newbie.... Hope you can help me

[AllanJP]

Okay, I found out how to do....

function mouseover1(txt)
{
var tmp = document.getElementById("frames");
tmp.src = txt;

}
function mouseout1()
{
var tmp = document.getElementById("frames");
tmp.src = "front.htm";
}
...
...
...
<a href="#" class="dark" onmouseover="mouseover1('index-2.html');" onmouseout="mouseout1()" >About Us</a>
...
...
...
<iframe src ="front.htm" name="frames" id="frames" width="100%" height="500" scrolling="no" frameborder="0"></iframe>
...
...
...

This solves the problem :-)
add the attribute name, and id to the <iframe> tag, and via the document.getElementById("frames"); I am able to set the <iframe src="someurl" > by tmp.src = txt; (see the function)