1/04/2013

Tutorial- Afiliados com efeito giratório





Oi!
Faz tempo que eu não posto, né?
É que eu estava meio ocupada na blogsfera!
Vou tentar não ser tão ausente!
Hoje e trago um tutorial que dá o efeito giratório nos afiliados.


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

E antes dessa tag cole o seguinte código:


.elitescala{
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-webkit-transition: 0s linear;
-webkit-transition: opacity 0.5s linear;
-webkit-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
-webkit-transition-duration: 1.20s;
-moz-transition: all 0.3s linear;
transition: all 0.3s linear;
background-color: #fff; /* Cor do fundo (se a imagem for png)*/padding: 3px;
}
.elitescala:hover {
-webkit-transform: scale(1.20);
-moz-transform: scale(1.20);
background-color: fff;
padding: 3px;
}
.elitescala:hover{
-webkit-transform: rotate(360deg);}
.elitescar{  border: #FFB6C1 2px solid; /*Cor e tamanho da borda da imagem*/-webkit-transition-duration: .40s; }  .elitescar:hover { -webkit-filter: saturate(0%) ; }
.Label {
background: #fff; /* Cor do fundo em hover*/display: inline-block;
text-align: center;
font-size:12px;
color: #FF1493;
text-shadow: 0px 0px 5px #fff;
float: center;
margin: 2px;
font-family: Century Gothic;
padding: 6px;
width: 75px;
height: auto;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-transition-duration: .60s;
}

Depois adicione um gadget HTML/JavaScript e cole o seguinte código:

<a href="Link do afiliado" title="Nome do afiliado"><img src="URL da imagem" class="elitescala" /></a>
<a href="Link do afiliado" title="Nome do afiliado"><img src="URL da imagem" class="elitescala" /></a>
<a href="Link do afiliado" title="Nome do afiliado"><img src="URL da imagem" class="elitescala" /></a>
<a href="Link do afiliado" title="Nome do afiliado"><img src="URL da imagem" class="elitescala" /></a>

Por hoje é só!
Bye bye! 

Um comentário:

  1. Esse tuto é muito bom eu uso ele *O*

    http://docemundokawaii.blogspot.com.br/

    ResponderExcluir

Oi meus Cats!
Regrinhas dos comentários:

-Sem ofensas a algum leitor, autor ou blog.
-Sem conteúdo ofensivo.
-Deixe o link do seu blog no comentário, que assim que puder retribuirei a visita.
-Pedidos, na Ask.
-Se comentou, volte para ver a resposta do comentário.
-"Seguindo, segue de volta?", aceito, não vejo mal nem um. Mas se não houver nada no comentário a ver com a postagem, o comentário será ignorado.

Comenta, vai?