Tutorial: Efeito sépia nas imagens do blog


Olá meus queridos! Como estão? Eu estou com saudades do blog. Tenho postado pouco porque acabei me dedicando demais à página do Facebook. No fim das contas não pude fazer muita coisa que pretendia fazer, mas estou dando o meu melhor para manter o blog atualizado.

O tutorial de hoje mostraremos como fazer o efeito de mudança de cor ao passar o mouse nas imagens do blog. Deixando um efeito sépia bem legal.

É muito simples. Abra o HTML do seu blog é cole o seguinte código acima de ]]></b:skin>

img {
-webkit-filter: sepia(0%);
transition:All 0.4s ease;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease;
}
img:hover {
-webkit-filter: sepia(100%);
transition:All 1s ease;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease;}

É só salvar e pronto! Todas as imagens irão ficar com o efeito  automaticamente.
Bem mais simples do que você imaginava não é? Espero que tenha gostado. Abraços!!!

Nenhum comentário:

Postar um comentário

- Críticas em anônimo serão excluídas. Se for criticar construtivamente, use um perfil.
- Não use palavras de baixo escalão.
- Tenha bom senso, palavras podem causar danos irreparáveis.