• Viernes 29 de Marzo de 2024, 16:14

Autor Tema:  Cambio De Imagen De Fondo En Tabla  (Leído 1438 veces)

diego.martinez

  • Miembro MUY activo
  • ***
  • Mensajes: 297
    • Ver Perfil
Cambio De Imagen De Fondo En Tabla
« en: Sábado 28 de Abril de 2007, 00:27 »
0
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.

Avalon

  • Miembro MUY activo
  • ***
  • Mensajes: 448
    • Ver Perfil
Re: Cambio De Imagen De Fondo En Tabla
« Respuesta #1 en: Martes 1 de Mayo de 2007, 01:34 »
0
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

diego.martinez

  • Miembro MUY activo
  • ***
  • Mensajes: 297
    • Ver Perfil
Re: Cambio De Imagen De Fondo En Tabla
« Respuesta #2 en: Martes 1 de Mayo de 2007, 19:47 »
0
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: