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!
Esse tuto é muito bom eu uso ele *O*
ResponderExcluirhttp://docemundokawaii.blogspot.com.br/