terça-feira, 14 de junho de 2011

Javascript: Pinte o resistor

Selecione o programa abaixo e copie.
<style type="text/css"><!--
table.senha tr {height: 40px; }
table.senha td {height: 40px; width: 14px;
background-image:
url("http://www.emararaquara.com.br/ingles/javascript/resistor-vasado.png")}
--></style>
<center>
<table class="senha" border="0" cellspacing="0"cellpadding="0">
<tr>
<td style="width: 22px"></td>
<td onClick="mudacor(this)"
style="background-position: -22px"></td>
<td onClick="mudacor(this)"
style="background-position: -36px"></td>
<td onClick="mudacor(this)"
style="background-position: -50px"></td>
<td onClick="mudacor(this)"
style="background-position: -64px"></td>
<td style="width: 30px; background-position: -78px">
</td></tr>
</table></center>
<script language="JavaScript">
var cores= new Array ("black", "brown", "red", "orange",
"yellow", "green", "blue", "violet", "grey", "white","gold",
"silver");
function mudacor (cel) {
    achou= false;
    i= 0;
    do {
        if (cores [i]== cel.bgColor) {
            achou= true;
        }
        i++;
    } while (i< cores.length && !achou);
    i= i% cores.length;
    cel.bgColor= cores [i];
}
</script>
Depois cole-o num editor de texto simples como o Notepad++, por exemplo.
Salve-o como resistor.html e abra-o num navegador de Internet.
Você vai obter uma imagem como esta:
Clique na imagem para colorir o resistor.
Nota: Este programa talvez não funcione corretamente no MSIE.

Nenhum comentário:

Postar um comentário