I'm new here. I'm designing my own site so I'm learning code as I go, and I've run into a problem. Here's my test page. I want the image in the "Articles" box to change when I hover over the links on the right, which it does right now. (Those are actually 3 different images.) I also want the image to link to the same article as the hovered link, kind of like Yahoo's current home page. I think this is all the relevant code I'm using right now:
HEAD:
<script language="JavaScript" type="text/JavaScript">
function showT(q)
{
document.getElementById('articles').setAttribute('src','0'+q+'.jpg')
}
</script>
BODY:
<!-- Begin main articles -->
<tr><td style="border-style:none dotted none none; border-width:1px; border-color:#5CB800" align="center" width="375" rowspan="3"><img id="articles" src="00.jpg" style="border-style:none"></td>
<!-- Right titles -->
<td style="border-style:none"><a href="#" onmouseover="showT(0)">TEST: This is the title of the article you're looking for</a></td></tr>
<!-- End of 1st row -->
<tr><td style="border-style:none"><a href="#" onmouseover="showT(1)">TEST: This is the title of the article you're looking for</a></td></tr>
<tr><td style="border-style:none"><a href="#" onmouseover="showT(2)">TEST: This is the title of the article you're looking for</a></td></tr>
<!-- End main articles -->
Thanks for the responses. Shanu, that helped to change the large image on mouseover like I want, but I don't know how to change the page the large image links to. Using the page you sent me as an example, I want that link to change to match the link of the small image. This is what I have so far:
Bookmarks