onmouseover sobre una tabla

[moron]

Hola:

Estoy jugando un poco con javascript, tengo una tabla donde dependiendo de si el mouse está sobre la tabla o si se saca el mouse de la misma, una imagen de un muñeco cambia.
Lo que ocurre es que al inicio la imagen aparece, pero cuando paso el mouse sobre la tabla la imagen no se muestra.

este es el código:

Código PHP:

    function PreocuparAlMunieco() {
           
           
            var imagen;
            imagen = document.getElementById("munieco")
            imagen.src = "preocupado.png";
            imagen.width = "40%";
 
        }
        function PonerContentoAlMunieco() {
            var imagen;
            imagen = document.getElementById("munieco")
            imagen.src = "contento.png";
            imagen.width = "40%";
         } 
   

Código PHP:

  <div><img id="munieco" src="contento.png"  width="40%" /></div>
<div>
<table width="70%" height="400px"  border="1" onmouseover="PreocuparAlMunieco()" onmouseout="PonerContentoAlMunieco()">
</div> 
   

Muchas gracias desde ya.

[freesoftwarrior]

Bueno, espero haberte comprendido. Yo lo hago de otra forma....

<script>
graphic1= new Image();
graphic1.src = "contento.png";
graphic1on = new Image();
graphic1on.src = "preocupado.png";

function imageChange(imageID,imageName)
{document.images[imageID].src = eval(imageName + ".src");}

</script>

<div><img name="one" src="contento.png"></div>
<div>
<table width="70%" height="400px" border="1" onmouseout="imageChange('one','graphic1')" onmouseover="imageChange('one','graphic1on')">
<tr><td>&nbsp;</td></tr>
</table>
</div>

Espero te sea de utilidad. Por cierto puedes incluir más de una ubicación, es decir, puedes hacer que cambie no sólo una imagen sino varias al mismo tiempo, sólo es cuestión de agregar más líneas al código así

//collages
alt0 = new Image();
alt0.src = "imagenes/jpg/collageinicio.jpg";
alt1 = new Image();
alt1.src = "imagenes/jpg/collagebio.jpg";

//botones
graphic1= new Image();
graphic1.src = "imagenes/jpg/biografia.jpg";
graphic1on = new Image();
graphic1on.src = "imagenes/jpg/biografiab.jpg";


function imageChange(imageID,imageName,imageID2,imageName2)
{
document.images[imageID].src = eval(imageName + ".src");
document.images[imageID2].src = eval(imageName2 + ".src");
}

y obviamente deberás tener una imagen con el nombre "collage" y otra con el nombre "botones" por ejemplo...

Suerte
Un saludo desde Lima, Perú