Cambiar el color de una celda al pasar el ratón

Forma sencilla en javascript de cambiar el color de celda de una tabla al situarnos encima de esta. Utilizaremos los eventos onmouseover cuando nos situemos encima con el cursor, y onmouseout cuando retiremos el cursor de la celda en este caso.

  1. <script language="javascript">
  2. function cambiacolor_over(celda){ celda.style.backgroundColor="#ff0000" }
  3. function cambiacolor_out(celda){ celda.style.backgroundColor="#ffffff" }
  4. </script>
  1. <table width="100%" border="1">
  2. <tr>
  3. <td bgcolor="#ffffff" onmouseover="cambiacolor_over(this)" onmouseout="cambiacolor_out(this)">celda uno</td>
  4. </tr>
  5. <tr>
  6. <td bgcolor="#ffffff" onmouseover="cambiacolor_over(this)" onmouseout="cambiacolor_out(this)">celda dos</td>
  7. </tr>
  8. <tr>
  9. <td bgcolor="#ffffff" onmouseover="cambiacolor_over(this)" onmouseout="cambiacolor_out(this)">celda tres</td>
  10. </tr>
  11. </table>

Ejemplo:

celda uno
celda dos
celda tres

Noticias

Pronto os mantendremos informados de nuevas noticias de diseño gráfico, páginas web, multimedia, etc..

Últimos tutoriales

Categorías

© León Púrpura 2008
Zamora | Salamanca | León

Profesionales de diseño web en León
Enlaces | Colabora con nosotros | Solicita presupuesto