2.12.12

Efeito Zooming



Já estou de férias viva , passei direto graças a Deus , e você já estão?
Tumblr_mdyyezbjw41rdacf0o1_500_large

OII querem aprender o efeito zooming? click aqui para vê-lo
Quer aprender então .....


Vá em seu HTML e procure por :
]]></b:skin>


Se achou acima da tag cole :

#zooming {
width:110px;
height:110px;
display: inline-block;
position:relative;
}
#zooming img {
position:absolute;
width:110px;
height:110px;
-webkit-transition-duration: .80s;
}
#zooming:hover img{
-webkit-transform:scale(1.5);
-moz-transform:scale(1.5);
-o-transform:scale(1.5);
opacity:0.3;
-webkit-transition-duration: .70s;
}
.zoomingout {
float:center;
width:110px;
height:110px;
border: 2px solid #e4a2c7;
overflow:hidden;
-webkit-transition-duration: .59s;
}
.zoomingout:hover {
float:center;
width:110px;height:110px;
border: 2px solid #e377b4;
overflow:hidden;
-webkit-transition-duration: .59s;
}
#palavras a.header {
width:110px;
height:110px;
margin-left:-1px;
opacity:1;
margin-top:-0px;
padding:4px;
text-align: center;
color:#bb4487;
font-size: 10px;
padding: 5px 2px 10px 2px ;
}
#palavras {
width:110px;
height:110px;
margin-left:-1px;
opacity:1;
margin-top:-0px;
padding:4px;
text-align: center;
color:#434343;
font-size: 10px;
padding: 5px 2px 10px 2px ;
}
Faça as alterações visualize e se estiver tudo certo , SALVE !

Agora vá em Layout → Adicionar um gadget → HTML/JavaScript
e cole

<div id="zooming" class="zoomingout"><img src="LINK DA SUA IMAGEM" class="image4" /><div id="palavras"><a href="link" class="header">#000000</a><br />Seu Texto</div></div>

Espero que tenham gostado !

Créditos : Kawaii Word 

7 comentários:

  1. Oi fofa, seu blog é lindo e adorei o tuto e esses que ficam no topo deixa o blog lindo.

    Seguindo. Segue de volta ? Meumundinho-fashion.blogspot.com

    ResponderExcluir
  2. Ainda não estou de férias, tenho aula até quarta =/
    Adorei o efeito!
    Beijo
    ill-helpyou.blogspot.com

    ResponderExcluir
  3. é nós eu tbm ja to d ferias, iuuupi! to seguindo, retribui?
    bj
    lamourmonage.blogspot.com

    ResponderExcluir
  4. Ainda não estou de férias =( Tomara que chegue logo, necessito! usdhasud Legal o efeito, você faz todos esses códigos? Pode dar umas aulinhas de como mecher assim?

    blog-lolandfun.blogspot.com

    ResponderExcluir
  5. Não estou de ferias e não passei direto :(
    Bem legal o efeito!
    Beijo, Lili
    Princesa Imperfeita // Layout novo!

    ResponderExcluir
  6. Ah tenho inveja eterna de você que já ta de férias :c kkkk
    Fiquei em 2 então né =/
    Enfim o efeito fica lindo *-*
    Beeeeeeeeeeeeijo <3
    ~ Visita lá? só clicar no perfil :3

    ResponderExcluir

Que bom que vai comentar !!
Mais para fazer isso leia as regrinhas:
- Aceito criticas ,sugestões e opiniões.
- Seguindo segue de volta,se comentar sobre o post.
- Não retribuirei a visita se não comentar sobre a postagem.
- Deixe o link do blog para eu retribuir a visita.
Eu e o DW agradecemos ! Fique com Deus .