script ocultar/mostrar

[gustax]

Hola gente, estoy utilizando un script que encontre googleando que la funcion que cumple es ocultar y mostrar una fila.

Lo que necesito es modificar ese script, pero el tema es que no se como, a ustedes los especializados en el tema seguro les resultara fácil pero para mi es chino básico.

Aca el script:

Código HTML:

<script>
function cambiarDisplay(id) {
  if (!document.getElementById) return false;
  fila = document.getElementById(id);
  if (fila.style.display != "none") {
    fila.style.display = "none"; //ocultar fila
  } else {
    fila.style.display = ""; //mostrar fila
  }
}</script> 

Aca el HTML:

Código HTML:

<table width="300" height="30" border="0" cellpadding="0" cellspacing="0">
                          <tr id="row1" onClick="cambiarDisplay('row2')">
                            <td background="menu/agitadores-on.gif"></td>
                          </tr>
                        </table>
                      <table width="300" height="100" border="0" cellpadding="0" cellspacing="0">
                        <tr id="row2" style="display:none">
                          <td><img src="menu/agitadores-sub.gif" width="300" height="120" /></td>
                        </tr>
                      </table> 

Para lo que lo utilizo es un listado de productos, bastante extenso, y necesitar resumir eso para que al cliente no le resulte tediosa la navegación.

Lo que necesito modificar, es que cuando este oculto, no me quede el espacio en blanco de lo que ocupa la tabla que esta oculta.
Y cuando esta oculto necesito cambiar la imagen agitadores-on.gif por agitadores-off.gif.

Aca la imagen: