Qual código eu posso usar para modificar a foto quando passar o mouse por ela?

Qual é minha questão:
Gostaria de saber qual código eu posso usar para trocar uma foto quando passar o mouse por ela.

No caso, eu gostaria de colocar uma foto em preto e branco de uma pessoa, e quando passasse o mouse, ela ficaria colorida e quando clicasse iria até o perfil do mesmo.

Medidas que eu tomei para corrigir o problema:
Vir até vocês.

Imagens do meu problema:


Endereço do meu fórum:
http://legilimensrpg.forumeiros.com/

Versão do meu fórum:
PHPBB3

Seja bem-vindo ao nosso fórum de Suporte! Como acabou de se inscrever, veja aqui alguns links importantes a saber: Regras do Fórum, e o que você não deve fazer neste fórum. Os demais fóruns de Suporte Forumeiros Lista de Tutoriais e astúcias e Questões frequentes. Conheça a Staff do Fórum dos Fóruns. Conheça a função Busca.

Olá,

Leia o tópico abaixo, ele trás o conteúdo que você deseja.

https://ajuda.forumeiros.com/t21619-

Atenciosamente.

qui está: <img src="ENDERECO_DA_IMAGEM_NORMAL" onmouseout="this.src='ENDERECO_DA_IMAGEM_NORMAL';" onmouseover="this.src='ENDERECO_DA_IMAGEM_AO_PASSAR_O_MOUSE';" />

Vermelho -> Deverá substituir onde estiver em vermelho pelo endereço da imagem que será carregada com a página e também o endereço da imagem que será exibida quando o ponteiro do mouse sair de cima dela.

Verde -> Substitua pelo endereço da imagem que será exibida quando o mouse estiver sobre ela. Somente tenha o cuidado de não colocar uma imagem muito pesada, pois para estas os internautas com conexão lenta irão demorar mais para carregar.

Ajuda? Abraços Zattch

Sim, deu certo, mas eu gostaria que quando passasse o mouse por cima, se clicasse fosse para um perfil. Como eu poderia fazer isso utilizando um código parecido com esse?

Olá,

Me desculpe, mas não compriendi o que deseja saber, poderia explicar melhor sua questão?

Até mais

Olá, poderá usar o mesmo código, apenas acrescentei a palavra "Veja o perfil", que quando clicado irá p/ o perfil configurado. É uma forma simples, porém eficiente! Abço

Código:

<center><img src="LINK DA IMAGEM COMUM" onmouseout="this.src='LINK DA IMAGEM APÓS PASSAR O MOUSE';" onmouseover="this.src='LINK DA IMAGEM APÓS PASSAR O MOUSE';" /></center><BR><center><a href="LINK DO PERFIL ENTRE AS ASPAS" target="_blank" >Veja o perfil </a></center>

Olá, o código ficou bugado, mas não teria como fazer sem ter um texto, o link fosse a própria foto?

Olá!

Então o código é esse:

Código:

<a href="LINK DO PERFIL ENTRE AS ASPAS" target="_blank" > <img src="LINK DA IMAGEM COMUM" onmouseout="this.src='LINK DA IMAGEM APÓS PASSAR O MOUSE';" onmouseover="this.src='LINK DA IMAGEM APÓS PASSAR O MOUSE';"/>

Testado e funcionando corretamente, veja acessando meu fórum e clicando em "SOBRE NÓS"

Abço