quarta-feira, 24 de julho de 2002

Mudando a cor de fundo da Linha (a là Hotmail)

Um pequeno script, a là Hotmail, para quando você quiser mudar a cor de fundo da linha quando você clica o Checkbox que há dentro dela.
(Obs.: haverá um erro de Javascript se o Checkbox não estiver dentro de uma célula de tabela)


<html>
<script language="JavaScript">
//detectando o navegador:
sAgent = navigator.userAgent;
ie = sAgent.indexOf("MSIE") > -1;


function MudarCor(CB){
  if (CB.checked){
    hL(CB);
  } else {
    dL(CB);
  }
}


function hL(E){
 if (ie) //se for internet explorer
  {
   while (E.tagName!="TR")
   {E=E.parentElement;}
  }
 else
  {
  while (E.tagName!="TR")
   {E=E.parentNode;}
  }
 E.className = "estilo1";
}


function dL(E){
 if (ie)
  {
  while (E.tagName!="TR")
   {E=E.parentElement;}
  }
 else
  {
  while (E.tagName!="TR")
   {E=E.parentNode;}
  }
 E.className = "estilo2";
}



</script>
<style type="text/css">
<!--
.estilo1 {
 background-color: #009999;
}
.estilo2 {
 background-color: #990000;
}
-->
</style>
<body>
Clique para ver funcionando!!!
<table width="75%" border="1" cellpadding="1" cellspacing="0" bordercolor="#FFFFFF">
  <tr class="estilo1">
    <td><input name="checkbox" type="checkbox" value="checkbox" checked onClick="MudarCor(this)"></td>
  </tr>
  <tr class="estilo2">
    <td><input type="checkbox" name="checkbox2" value="checkbox" onClick="MudarCor(this)"></td>
  </tr>
  <tr class="estilo1">
    <td><input name="checkbox3" type="checkbox" value="checkbox" checked onClick="MudarCor(this)"></td>
  </tr>
</table>
</body>
</html>



Esta matéria foi postada originalmente no ASP4Developers por Adriano Nântua, que na época era "Engenheiro de software e analista de sistemas; Desenvolvedor ASP, Delphi, C/C++ e Java/JSP/Servlets; InterBase fan; Linux fan; Alvirrubro inveterado.". Hoje, vai saber...

0 comentários: