Skift af image kombineret med on/off knap

Da jeg ikke ved, om det er bedst at spørge i alm. html, javascript eller anden kategori, så prøver jeg her.

Følgende side lavet i Dreamweaver og spørgsmålet går ud på følgende:
Hvordan kan jeg sammen med mouseon/over funktionen lave det således, at imageX også skifter til et andet image ?
Dvs at når musen er over imageAon/off skal imageX også skifte til et der kaldes for imageXA og når den så er over imageBon/off skal imageX skifte til imageXB osv.

Jeg håber at have udtrykt mig korrekt, ellers må i bare spørge.

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v2.0
  if (document.MM_swapImgData != null)
    for (var i=0; i<(document.MM_swapImgData.length-1); i+=2)
      document.MM_swapImgData[i].src = document.MM_swapImgData[i+1];
}

function MM_preloadImages() { //v2.0
  if (document.images) {
    var imgFiles = MM_preloadImages.arguments;
    if (document.preloadArray==null) document.preloadArray = new Array();
    var i = document.preloadArray.length;
    with (document) for (var j=0; j<imgFiles.length; j++) if (imgFiles[j].charAt(0)!="#"){
      preloadArray[i] = new Image;
      preloadArray[i++].src = imgFiles[j];
  } }
}

function MM_swapImage() { //v2.0
  var i,j=0,objStr,obj,swapArray=new Array,oldArray=document.MM_swapImgData;
  for (i=0; i < (MM_swapImage.arguments.length-2); i+=3) {
    objStr = MM_swapImage.arguments[(navigator.appName == 'Netscape')?i:i+1];
    if ((objStr.indexOf('document.layers[')==0 && document.layers==null) ||
        (objStr.indexOf('document.all[')  ==0 && document.all  ==null))
      objStr = 'document'+objStr.substring(objStr.lastIndexOf('.'),objStr.length);
    obj = eval(objStr);
    if (obj != null) {
      swapArray[j++] = obj;
      swapArray[j++] = (oldArray==null || oldArray[j-1]!=obj)?obj.src:oldArray[j];
      obj.src = MM_swapImage.arguments[i+2];
  } }
  document.MM_swapImgData = swapArray; //used for restore
}
//-->
</script>
</head>

<body bgcolor="#000000" onLoad="MM_preloadImages('/test/Imageaon.jpg','#942575944950');MM_preloadImages('/test/Imagebon.jpg','#942575997180');MM_preloadImages('/test/Imagecon.jpg','#942576050460')">
<div align="center">
  <table width="100%" border="1">
    <tr>
      <td height="688" width="18%">
        <div align="center">
          <table width="100%" border="1">
            <tr bgcolor="#000000">
              <td height="210" width="100">
                <p align="center"><img src="/test/imagex.jpg" width="150" height="150" align="absmiddle"></p>
                </td>
            </tr>
            <tr bgcolor="#000000">
              <td>
                <div align="center"><a href="/imagessidea.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('document.Imagea','document.Imagea','/test/Imageaon.jpg','#942575944950')"><img name="Imagea" border="0" src="/test/Imageaoff.jpg" width="150" height="25"></a></div>
              </td>
            </tr>
            <tr bgcolor="#000000">
              <td>
                <div align="center"><a href="/imagesideb.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('document.Imageb','document.Imageb','/test/Imagebon.jpg','#942575997180')"><img name="Imageb" border="0" src="/test/Imageboff.jpg" width="150" height="25"></a></div>
              </td>
            </tr>
            <tr bgcolor="#000000">
              <td>
                <div align="center"><a href="/imagesidec.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('document.Imagec','document.Imagec','/test/Imagecon.jpg','#942576050460')"><img name="Imagec" border="0" src="/test/Imagecoff.jpg" width="150" height="25"></a></div>
              </td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>&nbsp;</td>
            </tr>
            <tr bgcolor="#000000">
              <td>
                <p>&nbsp;</p>
                <p>&nbsp;</p>
              </td>
            </tr>
          </table>
        </div>
      </td>
      <td height="688" width="82%" bgcolor="#000000">
        <div align="center">
          <p><font face="Arial, Helvetica, sans-serif" color="#00FF00"><b>Test
            side.</b></font></p>
          <p>&nbsp;</p>
         
        </div>
      </td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
</div>
</body>
</html>

\manon