Ontem (24/11), eu postei um texto sobre modinhas e perguntei se vocês queriam um tutorial de um efeito para afiliados que eu fiz e postei no blog de testes daqui. Vocês disseram que queriam, então cá estou eu trazendo ele :) Yupi.
O efeito é esse (veja no Gadget do lado de cá <<), ele foi totalmente feito por mim, então se quiser repassar, dê os créditos. Ele é bem básico, eu ainda estou aprendendo a fazer, mesmo assim, ele é bem legal. Uma dica: Se for usar, use fotos um pouco escuras para que não fique com muita luz. Continue lendo e pegue o código do efeito.
Bom, para usá-lo é bem simples. 1°: Vá em modelo, editar HTML e procure por "]]></b:skin", quando achar, cole o seguinte código ACIMA dele:
/*------ Efeito para Afiliados I - Efeito Roda (Etc For Me)------*/> Depois vá em layout, adicionar um gadget, HTML - Java Script e cole o seguinte código (fazendo as alterações necessárias):
.roda { -webkit-transition-duration: .90s;
-webkit-filter: grayscale(400%);
}
.roda:hover {
-webkit-transition-duration: .90s;
-webkit-filter: grayscale(400%);
-webkit-filter: contrast(200%);
-border-radius:180px 180px 180px 180px;
-moz-border-radius: 180px 180px 180px 180px;
-webkit-border-radius: 180px 180px 180px 180px;
}
/*------ Efeito para Afiliados I - Efeito Roda (Etc For Me)------*/
<a href="LINK DO BLOG" title="TÍTULO DO BLOG"><img class="roda" src="LINK DA IMAGEM"/></a>
<a href="LINK DO BLOG" title="TÍTULO DO BLOG"><img class="roda" src="LINK DA IMAGEM"/></a>
<a href="LINK DO BLOG" title="TÍTULO DO BLOG"><img class="roda" src="LINK DA IMAGEM"/></a>
<a href="LINK DO BLOG" title="TÍTULO DO BLOG"><img class="roda" src="LINK DA IMAGEM"/></a>
Se você precisar de mais imagens, vá acrescentando mais desse último código até a quantidade que quer. Bom gente, o tutorial foi esse, espero que vocês tenham gostado e usem. Se usar, comente por favor, até mais amores, beijos ♥.
Aw bem bonitinho o efeito, fica bem colorido ^^
ResponderExcluirhtmlandresources.blogspot.com
Awn, obrigada ♥
ExcluirMuito fofo o efeito <3
ResponderExcluirxoxo || Lovers Of Html ♥
Ownt, valeu ♥
ExcluirEu amei o seu blog <3
ExcluirEu achei esse efeito bem fofo, mas não vou usar porque acabei de trocar de lay, talvez num próximo ^^
ResponderExcluirObrigada <3
Excluir