Cambiar Color (Hotmail)

RakoVky · #1 (**permalink**) 14/02/2003, 18:19

Hola a todos.

Como puedo cambiar de color las filas de una tabla de forma interactiva?....

Es decir, que al marcar un checkbox en el formulario la fila cambie a otro color diferente.

Lo que quiero es hacerlo tal como funciona en la bandeja de entrada de correo de Hotmail....

Mil gracias de antemano.....

este es el formulari en donde quiero hacer esto...

<form action="" method="post" name="formulario" id="formulario">
<br>
<table width="75%" border="1" align="center">
<tr bgcolor="#CCCCCC">
<td width="11%">
<input type="checkbox" name="checkbox" value="checkbox"></td>
<td width="89%">Campo 1</td>
</tr>
<tr bgcolor="#CCCCCC">
<td>
<input type="checkbox" name="checkbox2" value="checkbox"></td>
<td>Campo 2</td>
</tr>
<tr bgcolor="#CCCCCC">
<td>
<input type="checkbox" name="checkbox3" value="checkbox"></td>
<td>Campo 3</td>
</tr>
</table>
<br>
</form>

Yanix · #2 (**permalink**) 14/02/2003, 21:15

Hice unas modificaciones a unos códigos que tenía en mi trabajo...y creo que logré al fin adaptarlos a lo que deseas. Solo lo probé en IE 6, pero imagino funciona en IE 5.5 en adelante. No funciona en Opera 6.05 e imagino que tampoco en Netscape...así que habría que adaptarlos...quizás más adelante

Es que soy usuaria de IE en el trabajo, lo siento

Código:

<html>
<head>
<script language= "javascript">
function colorear(srcElement) {
   var elcheck = event.srcElement;
   var lafila = elcheck;
 
   while (lafila && !(lafila.tagName == "TR")) {
       lafila = lafila.parentElement; }
       if (!(lafila == elcheck)) {
         if (elcheck.checked) {
         lafila.style.backgroundColor = "#A0E2C4";  }
       else  {
         lafila.style.backgroundColor = "#CCCCCC";  }
}
}
</script>
</head>
<body>
<form action="" method="post" name="formulario" id="formulario">
<br>
<table width="75%" border="1" align="center">
<tr bgcolor="#CCCCCC"> 
<td width="11%"> 
<input type="checkbox" name="checkbox" value="checkbox" ONCLICK="colorear(this);"></td>
<td width="89%">Campo 1</td>
</tr>
<tr  bgcolor="#CCCCCC"> 
<td> 
<input type="checkbox" name="checkbox2" value="checkbox" ONCLICK="colorear(this);"></td>
<td>Campo 2</td>
</tr>
<tr bgcolor="#CCCCCC"> 
<td> 
<input type="checkbox" name="checkbox3" value="checkbox" ONCLICK="colorear(this);"></td>
<td>Campo 3</td>
</tr>
</table>
<br>
</form>
</body>
</html>

Espero te sirva