now, im completely new to this concept (as far as coding it goes), and i dont know much about javascript
i know a fair amount of HTML but nothing impressive
what i want to be able to do is use the rollover image effect using javascript/html
i have that, but the way im using it, i want the mouseover image to remain when the page its linked to is active in the ifram below it
i have not been able to find anything on this, and i fear that i might have to use flash? which i dont know the first thing about and im not nearly ready to take on that challenge....
the following is the codes that are on my website:
<script TYPE="text/javascript">
var rollOverArr=new Array();
function setrollover(OverImgSrc,pageImageName)
{
if (! document.images)return;
if (pageImageName == null)
pageImageName = document.images[document.images.length-1].name;
rollOverArr[pageImageName]=new Object;
rollOverArr[pageImageName].overImg = new Image;
rollOverArr[pageImageName].overImg.src=OverImgSrc;
}
function rollover(pageImageName)
{
if (! document.images)return;
if (! rollOverArr[pageImageName])return;
if (! rollOverArr[pageImageName].outImg)
{
rollOverArr[pageImageName].outImg = new Image;
rollOverArr[pageImageName].outImg.src = document.images[pageImageName].src;
}
document.images[pageImageName].src=rollOverArr[pageImageName].overImg.src;
}
function rollout(pageImageName)
{
if (! document.images)return;
if (! rollOverArr[pageImageName])return;
document.images[pageImageName].src=rollOverArr[pageImageName].outImg.src;
}
//-->
</SCRIPT>
<html>
<title>Watch Your Head Studio</title>
<body>
<center>
<table border="0">
<tr>
<td colspan="6"><img src="header.jpg"></td>
</tr>
<tr>
<td align="center">  
<a href="home.html" target="iframe"
onMouseOver = "rollover('home')"
onMouseOut = "rollout('home')"
><font size="3" face="Monotype Corsiva">Home</a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>    </td>
<td align="center">  
<a href="rates.html" target="iframe"
onMouseOver = "rollover('rates')"
onMouseOut = "rollout('rates')"
><font size="3" face="Monotype Corsiva">Rates</a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>    </td>
<td align="center">  
<a href="samples.html" target="iframe"
onMouseOver = "rollover('samples')"
onMouseOut = "rollout('samples')"
><font size="3" face="Monotype Corsiva">Samples</a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT></td>
<td align="center">  
<a href="bands.html" target="iframe"
onMouseOver = "rollover('bands')"
onMouseOut = "rollout('bands')"
><font size="3" face="Monotype Corsiva">Bands</a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>    </td>
<td align="center">
<a href="testaments.html" target="iframe"
onMouseOver = "rollover('testamonies')"
onMouseOut = "rollout('testamonies')"
><font size="3" face="Monotype Corsiva">Testaments</a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT></td>
<td align="center">
<a href="contact.html" target="iframe"
onMouseOver = "rollover('contact')"
onMouseOut = "rollout('contact')"
><font size="3" face="Monotype Corsiva">Contact</a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT></td>
</tr>
<tr>
<td align="center">
<a href="home.html" target="iframe"
onMouseOver = "rollover('home')"
onMouseOut = "rollout('home')"
><img src="inactivelink.jpg" name="home" border=0 height="105"></a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>
</td>
<td align="center">
<a href="rates.html" target="iframe"
onMouseOver = "rollover('rates')"
onMouseOut = "rollout('rates')"
><img src="inactivelink.jpg" name="rates" border=0 height="105"></a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>
</td>
<td align="center">
<a href="samples.html" target="iframe"
onMouseOver = "rollover('samples')"
onMouseOut = "rollout('samples')"
><img src="inactivelink.jpg" name="samples" border=0 height="105"></a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>
</td>
<td align="center">
<a href="bands.html" target="iframe"
onMouseOver = "rollover('bands')"
onMouseOut = "rollout('bands')"
><img src="inactivelink.jpg" name="bands" border=0 height="105"></a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>
</td>
<td align="center">
<a href="testaments.html" target="iframe"
onMouseOver = "rollover('testamonies')"
onMouseOut = "rollout('testamonies')"
><img src="inactivelink.jpg" name="testamonies" border=0 height="105"></a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>
</td> <td align="center">
<a href="contact.html" target="iframe"
onMouseOver = "rollover('contact')"
onMouseOut = "rollout('contact')"
><img src="inactivelink.jpg" name="contact" border=0 height="105"></a>
<script TYPE="text/javascript">
<!--
setrollover("activelink.jpg");
//-->
</SCRIPT>
</td>
</tr>
<tr>
<td colspan="6" align="center">
<iframe name="iframe" height="400" width="500" src="home.html" frameborder="1"></iframe>
</td>
</tr>
</table>
</body>
</html>
the address is www.watchyourheadstudio.be
and yes i know it sucks ATM but i just wanna get the basic layout done before i continue on with the graphics and such
id really appreciate any help anyone can give me
thanks in advance