Alterando imagem ao clicar na imagem

[renan.mafra 0]

Olá pessoal,

 

Tenho uma tabela que é gerada automaticamente pelo PHP,

nessa tabela tem uns 12 fotos em thumbnails, quando o usuário clica

no thumbnail aparece a foto grande embaixo, até aí tudo OK.

 

Mais para cada thumbnail colorido existe um thumbnail igual só que

em preto e branco, gostaria que quando alguém clicasse no thumbnail

colorido aparecesse o thumbnail P/B após o clique.

 

O nome dos thumbnails são sempre nesse esquema:

 

thumbnail colorido: thumb_foto01.gif

thumbnail P/B: thumb_02foto01.gif

 

thumbnail colorido: thumb_foto077.gif

thumbnail P/B: thumb_02foto077.gif

 

Ou seja o colorido tem sempre a palavra thumb_ na frente do nome da imagem

e o preto e branco é o mesmo nome só que com a palavra thumb_02 na frente.

 

 

é para indicar qual o thumb que esta ativo no momento.

 

Como faço para que quando clicar no colorido apareça o P/B ???

[hantaro 1]

Basta apenas voce usar o onclick no link e o setSttribute na função, veja:

 

function img(id,img) {
document.getElementById(id).setAttribute('src',img);
}

e na suas imagem faz assim

 

<img src="x.jpg" id="foto" onclick="img('foto','imagem.jpg');">

Onde primeiro voce define o src como a foto colorida, entao voce tera que arrumar um jeito de o id das fotos nao serem iguais, e no lugar onde que ta imagem.jpg voce colocara a imagem P/B

 

Caso voce precise colocar o caminho da imagem, faça no função para pesar menos a pagina

 

document.getElementById(id).setAttribute('src','seu_caminho/' + img);

espero ter ajudado