Foros del Web » Programando para Internet » Javascript »

onmouseover sobre una tabla

Estas en el tema de onmouseover sobre una tabla en el foro de Javascript en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 26/09/2011, 08:18
Avatar de moron  
Fecha de Ingreso: mayo-2004
Mensajes: 972
Antigüedad: 19 años, 10 meses
Puntos: 2
onmouseover sobre una tabla

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.
  #2 (permalink)  
Antiguo 26/09/2011, 10:24
Avatar de freesoftwarrior  
Fecha de Ingreso: marzo-2006
Mensajes: 362
Antigüedad: 18 años
Puntos: 10
Respuesta: onmouseover sobre una tabla

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

Cita:
<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í

Cita:
//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ú

Etiquetas: onmouseover, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:38.