Novidades

20 julho 2012

Tutorial - efeito giratório nas fotos dos afiliados




 Olá babys, tudo bem? agora esse tutorial e muito legal aprendi no Blog word KAWAii eu não vou usar esse feito por que  acho que não combinaria muito e daria
muito trabalho para refazer todo o menu de afiliados mas  achei que vocês iriam gostar ele e super maneiro
quando ví pela primeira vez ficava que nem uma doida passando o mouse para ve-lô virar. então vamos lá?


1. vá em modelo > editar HTML>Procure por ]]></b:skin> e acima dessa tag cole:
.elite{ -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; width:auto; -webkit-transition-duration: 1.20s;
box-shadow: 2px 1px 2px #909090;
}
.elite:hover{-webkit-transform: rotate(360deg);} 

2. É só isso. Para usar você vai em um gadget de HTML/JavaScript e cola:
<a href="Link do Blog" title="Título do Blog"><img src="Link da Imagem" class="elite"/></a>

É só colocar os links conforme as palavras indicam e caso queiram que ela seja assim e tenha o efeito opacidade, use esse código:

<a href="Link do Blog" title=" Título do Blog"><img src=" Link da Imagem" style="opacity: 0.5"; class="elite" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"/></a>



CREDITOS Á : WORD KAWAII

5 comentários:

  1. Muito boa a dica, acho que fica muito fofinho fotos girando até nos posts. Gostaria de saber como é que coloca afiliados, faz um tutu? :3

    Obrigada pela visitinha e tem post novo lá no blog, quando puder passa pra dar uma conferida hein.

    http://acimadoarcoiris.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Claro vou fazer agora agurade, ainda hoje posto pra você.

      Excluir
  2. No meu HTML não tem essa palavra ]]> .O que eu faço?

    ResponderExcluir

Regrinhas!
1- aceito seguindo segue de volta
2- sem xingamentos! se expresse de uma maneira mais civilizada.
3- aceito criticas e Elogios