segunda-feira, 30 de dezembro de 2013

Efeito Zooming


Oiie Gnt,Vim Trazer UM Tutu Super Fofo...:3
O Credito Do tut estaá Abaixo!!!


Agr Vms,Para o Tutorial


1.Abra Seu "Html" E Procure Por: ]]></b:skin>.Acima 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 ; 
}

  Edite As Partes  De acordo Com Vc.

2.Vá Em LayouT:e Abra um Html/Java Script Cole:


<div id="zooming" class="zoomingout"><img src="LINK DA SUA IMAGEM" class="image4" />
<div id="palavras"><a href="link" class="header">TEXTO EM ROXO OU OUTRA COR</a>
<br />
TEXTO TEXTO TEXTO</div></div>
Fez Tudo,So Visualizar E Salva! :)
Beiju's

Nenhum comentário :

Postar um comentário