SoloCodigo

Programación Web y Scripting => JavaScript => Mensaje iniciado por: diego.martinez en Sábado 28 de Abril de 2007, 00:27

Título: Cambio De Imagen De Fondo En Tabla
Publicado por: diego.martinez en Sábado 28 de Abril de 2007, 00:27

Buenas:

Estoy haciendo una pequeña funcion en php para que me pinte un menu.
Para ello, dibujo las celdas de una tabla y en ellas pongo un background de imagen.
Mi intención es que cuando se pase el cursor por encima (OnMouseOver) se cambie la imagen de background por otra.

He probado con :

<table>
<tr>

<td onMouseOver="javascript: style.background-image=url('imagen_over.gif');" style="background-image:url('imagen.gif');">

</td>
</tr>
</table>

Pero no tiene ningun efecto, me podeis indicar como se podria hacer? gracias de antemano.

PD: He visto algunos tutoriales para hacerlo cambiando el class style , pero no me vale por que es un background distinto segun la linea de la tabla.

Título: Re: Cambio De Imagen De Fondo En Tabla
Publicado por: Avalon en Martes 1 de Mayo de 2007, 01:34

Hola. He hecho algunas pruebas y solo he conseguido que funcione así

Código: Text

1. &#60;script language=&#34;javascript&#34;&#62;
2.   function cambiarBG(celda, imagen) {
3.     celda.style.backgroundImage = &#34;url(&#34;+imagen+&#34;)&#34;;
4.   }
5. &#60;/script&#62;
6. &#60;table&#62;
7. &#60;tr&#62;
8. &#60;td onMouseOver=&#34;cambiarBG(this, 'imagen_over.gif');&#34; style=&#34;background-image:url('logo_i.gif');&#34;&#62;
9. &#60;/td&#62;
10. &#60;/tr&#62;
11. &#60;/table&#62;
12.  
13.  

Está probado en IE y en Firefox. Espero que te sirva.

Salu2,
Avalon

Título: Re: Cambio De Imagen De Fondo En Tabla
Publicado por: diego.martinez en Martes 1 de Mayo de 2007, 19:47

yuhu!

Gracias Avalon!

He podido hacerlo gracias a tu codigo, parece que el fallo es que tenia que poner las comillas que has puesto en la funcion.

En modo "inline" seria asi:

<table>
<tr>
<td onMouseOver="javascript: this.style.backgroundImage='url(ImgOver.gif)';"
onMouseOut="javascript: this.style.backgroundImage='url(ImgOut.gif)';"
style="background-image:url(ImgOut.gif);"> PRUEBA </td>
</tr>
</table>

Muchas gracias!  :lol: