clique aqui


BLOGS QUE ADMIRO ACIMA E OUTROS LINKS ABAIXO

30/07/2012

Tutorial: Efeito Zoom nos afiliados ²


Yo minna-san! Hoje trago um tutu bem maneiro pra vocês colocar efeito zoom nos afiliados, os creditos são do blog Kawaii Wordl. Caso queiram dar uma olhadinha aqui esta. Então vamos lá!?
Procurem por body {
Quando achar coloque quando a } chave estiver fechada, cole o codigo abaixo depois dela.
 
/* Efeito zoom nos afiliados */
.efeito {-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-webkit-transition: 0s linear;
-webkit-transition: opacity 0.6s linear;
-webkit-transition: all 0.8s linear;
-webkit-transition: all 0.8s linear;
-moz-transition: all 0.8s linear;
transition: all 0.8s linear;
background-color: #619a83; /* Cor da Borda */
padding: 3px; }
.efeito:hover {-webkit-transform: scale(1.50);
-moz-transform: scale(1.50);
background-color: #d75d7d; /*Cor da borda quando o mouse passa  */
padding: 3px; }

Depois vá ate ao Design e adicione um Gadgets do HTML/JavaScript e cole isso dentro.

<a href="Link para a Imagem" title="Título do Link"><img src="Url da Imagem" class="efeito"></a>

Prontinho é isso ai!!!

2 comentários: