[Tutorial] Paginas Dinamicas com Javascript 1

Assunto: [Tutorial] Paginas Dinamicas com Javascript 1 Ter Jan 25 2011, 13:39

Imagens que mudam quando clicadas

Esse tutorial explica o basico de como criar uma imagem que mude quando clicada, usando javascript.

Usaremos como base o seguinte body de um documento.

Código:: <body>
<img id='imagem' src='http://hitskin.com/themes/15/37/23/i_folder_big.png' onClick='trocar(this)'/>
</body>

Agora, um javascript que mudará a imagem, de uma para a outra, sempre que clicada.

Código:: <script type='text/javascript'>
var click = 0;
function trocar(imagem)
{
if (click == 1) //se a imagem esta em seu estado clicado, sera executado
{
imagem.src = 'http://hitskin.com/themes/15/37/23/i_folder_big.png';
click = 0; //muda a imagem pra o estado nao-clicado
}
else if (click == 0) //oposto do codigo acima
{
imagem.src = 'http://hitskin.com/themes/15/37/23/i_folder_locked_big.png';
click = 1;
}
}

O efeito desse codigo seria essa imagem:
[Tutorial] Paginas Dinamicas com Javascript 1 I_folder_big

Que qando clicada viraria essa:
[Tutorial] Paginas Dinamicas com Javascript 1 I_folder_locked_big

e que quando clicada voltaria a ser a outra e assim infinitamente...

[Tutorial] Paginas Dinamicas com Javascript 1 Comentej

» tutorial de gfx
» Tutorial - Redes
» [Tutorial] GFX Tobi
» [Tutorial] Onda do Mar
» [Tutorial] Efeito Poeira