Simple question - onmouseover affecting other elements

Hi this is a simple question I just do not know the JS syntax.  I want a mouseover image to activate a mouseover on another element.

As an example visit http://www.greenteadesign.com/test.html

Now look at the mouseover on the thumbnail in the left panel.  It currently borders the thumb in green as well as showing a transparent gif on the main image (right panel).

What I want to do is have the mouseover on the transparent gif (right panel), border the corresponding thumbnail (left panel)

Here is the JS for the thumbnails:

<script language="JavaScript1.2">
/*
Highlight Image Script II-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/
      
function borderit(which,color){
//if IE 4+ or NS 6+
if (document.all||document.getElementById){
which.style.borderColor=color
}
}
</script>

And here is the code on the thumb referencing the JS for the thumbnail:

<a href="stereostep.html" class="small" onMouseOut="toggle('item1')" onmouseover="toggle('item1')"><img src="images/steptansu/stereostep-2tone-thumb.jpg" width=65 height=55 alt="" border=0 class="borderimage" onMouseover="borderit(this,'#647F5B')" onMouseout="borderit(this,'white')"><br></a>

Finally here is the code for one of the transparent gifs:

<div id="Stepper" style="position:absolute; width:165px; height:167px; z-index:9; left: 524px; top: 296px" onMouseOver="toggle('item1')" onMouseOut="toggle('item1')"><a href="#"><img src="spacer.gif" width="165" height="167" border="0"></a></div>

Thanks in advance,
Hayden

(P.S. Additionally I would like the red text links to the right of the thumbnails to hover when the thumb is onmouseover, I'm not sure if that deserves another thread)