Olá olá galera tudo bem com vocês? O post de hoje vai ser um tutorial muito fácil e prático, para você que adora efeitos é algo super bacana. Bom, não irei mostrar como fica o efeito aqui no post, mas irá ficar preto e branco a imagem quando você passar o mouse em cima da imagem.
Vamos ao tuto que é o que interessa nesse momento.
Vá em editar HTML > procure por ]]></b:skin> e abaixo cole o seguinte código:
<style>img {filter: none; -webkit-filter: grayscale(0); -webkit-transition:All 1s ease; -moz-transition:All 1s ease; -o-transition:All 1s ease;} img:hover { filter: url(http://static.tumblr.com/zh19ysk/pOvm9hpdf/filters.svg); filter: gray; -webkit-filter: grayscale(1); -webkit-transition:All 1s ease; -moz-transition:All 1s ease; -o-transition:All 1s ease;}</style>
Clique em visualizar e se o efeito funcionar salve! Fácil não? Encontrei esse código no tumblr e achei muito legal, pois deu para usa-lo aqui no blog, enfim... Espero que tenham gostado do post e até o próximo post.
Obs: Irá ficar com o efeito grayscale em todas as imagens do seu blog.
Obs: Irá ficar com o efeito grayscale em todas as imagens do seu blog.
Ótimo tutorial, amei seu blog... e estou seguindo!
ResponderExcluirKisses <3
space-sweet-girl.blogspot.com.br
Obrigado!!! =^.^=
Excluir