si no entendí mal:
Código HTML:
<html>
<head>
<title></title>
<script>
var Click="";
function clk(cc){
Click.className="fondo";
Click=cc;
}
function over(c){
c.className="fondo_over";
}
function out(C){
C.className="fondo";
Click.className="fondo_over";
}
</script>
<style type="text/css">
<!--
.fondo {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #666666;
background-color: #FFFFCC;
background-image: url(fondo.gif);
}
.fondo_over {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #eeeeee;
background-color: #FF9900;
background-image: url(fondo_over.gif);
}
-->
</style>
</head>
<body >
<table width="100" border="1" align="center">
<tr>
<td width="100" height="40" class="fondo" onclick="clk(this)" onmouseover="over(this)" onmouseout="out(this)"> </td>
</tr>
<tr>
<td width="100" height="40" class="fondo" onclick="clk(this)" onmouseover="over(this)" onmouseout="out(this)"> </td>
</tr>
<tr>
<td width="100" height="40" class="fondo" onclick="clk(this)" onmouseover="over(this)" onmouseout="out(this)"> </td>
</tr>
</table>
</body>
</html> Simepre y cuando utilices dos imágenes (una de fondo y otra al hacer el over y click), aunque si no se podría modificar.