Bom dia gente! Hoje é domingo, dia de tutorial! E trouxe um bem fácil e legal pra ser usado nas imagens do seu blog (caso queira, é claro né). Ele faz com que a sua imagem se "desfoque" quando você passa o mouse sobre a imagem. Não sabe como é? Assim:
antes de passar o mouse - com o mouse em cima da imagem
É bem fácil de se colocar no blog! Vamos lá? Vá no seu blog e em Modelo, então clique em Editar HTML e marque a caixinha de "Expandir modelos de widget". Então tecle Ctrl+F e procure por:]]></b:skin>Então cole acima do código encontrado o seguinte código:
.dressbreaker {
-webkit-transition: all .1s linear;
-moz-transition: all .1s linear;
transition: all .1s linear}
.dressbreaker:hover {
-webkit-filter: blur(1px);z-index: -99px;}
Eu dei pro efeito o nome de "dressbreaker", era uma coisa do anime que eu estava assistindo na época que fiz ele (
<a href="LINK"><img class="dressbreaker" src="URL DA IMAGEM" /></a>Use o código acima caso queira que a sua imagem leve para algum link (tipo a dos afiliados daqui do blog, no gadget de Gatinhos). Caso não queira com link, use o seguinte código:
<img class="dressbreaker" src="URL DA IMAGEM" />Aí é só trocar "URL DA IMAGEM" por, obviamente, a url da sua imagem. Também dá pra utilizar isso nas imagens dos posts, ok? Só colocar o código na parte de "HTML" (do lado de Escrever, bem na esquerda da barra do menu onde você edita o seu post).
Prontinho, tutorial feito!
Esse efeito é muito legal. Beijão <3
ResponderExcluir@keithpappen
www.detalhesamor.blogspot.com
;)
ExcluirVou usar \õ AUSHSAUH', adorei o tuto, PC <33'
ResponderExcluir-4 Seconds.
Bom que gostou Ju.♥
ExcluirAdorei, o efeito fica muito fofo ♥ XX
ResponderExcluirviverserfeliz-renata.blogspot.com
Bom que gostou Renata.♥
ExcluirEsse efeito é muito fofo, dá um ar de lindezaa hahahahah
ResponderExcluirRetribui? http://caramelises.blogspot.com.br/ , 2bjs (:
srsr
ExcluirAEEEEEEEEEEEEEEE, estou me sentindo muito famosa, meu pedido foi atendido ~bitch pls.
ResponderExcluirAmei o tutorial, obrigado mesmo, Paula *u*
Beijos :3
http://garotasatrevidas-s2.blogspot.com.br/
AH, que bom flor.♥
ExcluirAdorie o tutorial. eu sempre ficava vendo o efeito tentado saber como era feito
ResponderExcluirbeijos
Esperamos ter te ajudado Lola.♥
ExcluirFica muito fofo! :3
ResponderExcluirBjo, Sel ;*
Jovens Gordinhas
Unicórnio com Bigode
Nerd Descolada
gostei :)
ResponderExcluir:)
ExcluirAmo *3* imagem de Arya Costa Stark <3
ResponderExcluirArya fofa.♥
ExcluirDeve ficar legal mesmo o efeito ^^
ResponderExcluirrelicariodasrafleur.blogspot.com.br
Fica sim.♥
Excluiré muito massa esse efeito *--* haha
ResponderExcluirBeijos s2
arazaodesorrir.blogspot.com
Bom que gosta Sara.♥
ExcluirQue legal o efeito, achei super interessante, talvez eu use no meu próximo layout ^-^
ResponderExcluirthe-paradiise.blogspot.com.br/
Que bom que você gostou Leandro.♥
ExcluirO resultado é muito fofo mesmo, a imagem fica linda! Beijos
ResponderExcluirilovecantores.blogspot.com
Fica mesmo.♥
ExcluirAdorei o tuto, eu gosto muito desse efeito e sempre uso :D
ResponderExcluirBeijinhos
Facebook do blog
conversando-com-a-lua.blogspot.com.br
Ah, que bom Day.♥
Excluiradorei, e super fácil de fazer também né ?
ResponderExcluirUaau, parabéns pelo seu blog, eu amei aqui, amei sua criatividade, seu modo de falar com os leitores, a forma que você usa nas postagens, o design e etc, eu realmente curti e vou voltar aqui sempre ! Obrigada por ter criado . Parabéns novamente e já estou seguindo ((: Parabéns !!
http://dezesseteetantos.blogspot.com.br/
Fácil fácil.♥
ExcluirNossa, que legal!!!
ResponderExcluirvou tentar fazer...
Beijos!!!
http://nailmypassion.blogspot.com.br/
Faça isso Thabata.♥
ExcluirAcho super lindo! Pena que eu to usando o fade, hehe. Adorei o tuto! :D
ResponderExcluirBeijos,
www.sonhosde-primavera.com
pensa-mentosmeus.blogspot.com
Bom que gostou flor.♥
ExcluirARRASOU! Vou aplicar isto no meu blog de testes e ver como fica. ( :
ResponderExcluir>>Bonequiinha de Luxo<<
- xoxo -
Faça isso Amanda.♥
ExcluirPaula, eu mudei o nome do meu blog, vc poderia divulgar o novo endereço?
ResponderExcluirhttp://batomdeveludo.blogspot.com.br/
Obrigada, beijos ♥.
Eu vi esse efeito nas imagens de um blog uma vez, acho esse efeito super fofo e é bem simples o tutorial ^^
ResponderExcluirbjo ;*
1maginer | blogspot.com
Bom que gosta flor.♥
ExcluirEspero que consiga Kamilly.♥
ResponderExcluir