tutorial

Tutorial: Efeito Rotate

setembro 08, 2013,2 Comments


Vas Happenin guys? 

Só 'tô esperando dar mais alguns dias para eu postar o meu layout novo, eu mostrei para algumas amigas no Facebook e elas gostaram, bom o que eu posso falar dele, que ele tem um cor diferente, NUNCA usada por mim, nunca mesmo, e há uma paleta de cores diferente, poucas pessoas usam aquelas cores, mas que eu gostei, ah cara eu gostei. Ele tem o mesmo tema que sempre será One Direction, talvez em novembro eu mude para um outro tema mas só porque é mês do meu aniversário mas em exceção os outros layout's sempre sera da One Direction. Enfim, eu entrei na onda de fazer Layout e 'tô fazendo um layout free daqueles que estão na moda agora, com duas sidebar's um cabeçalho grandão e aquele menu lá no topo, sabem o que eu 'tô falando? E então eu ainda não decidi que tema eu faço o Layout, porque eu sempre faço com os temas da One Direction e uma vez eu fiz com o Tema do Bieber, e então o que acham? Que eu faça ainda com temas da 1D ou faço de outro tema? Qual vocês me sugerem? 

Bom, enquanto vocês pensam em qual tema eu faço o Layout free pra vocês eu tô ali admirando a capa dessa postagem, esse Harry Styles é tão lindo que tá até ânsia de ficar olhando tanto pra ele. Sério por mais que o Niall seja meu favorito, o Harry me arranca suspiros. -ok to parecendo uma retardada- Enfim, vamos falar sobre a postagem de hoje que é sobre um efeito, nada tão UAU porque eu não sou uma Web Design profissional da vida. Eu sou uma qualquer que faz imagines. -momento depressão- Sério, eu andei mexendo com HTML e fiz meu primeiro efeito, ele é parecido com outros por ai então não me xinguem porque eu nunca fiz um efeito antes e isso é muito novo pra mim, por mais que eu não goste de mexer com HTML e fazer essas coisas eu tenho paciência e curiosidade pra aprender então eu assim fazendo MERDA nenhuma inventei de tentar fazer algo e saiu algo mais ou menos assim: Preview. E se vocês quiserem aprender eu ensino. Vamos lá? 

1º Passo: Vai em Modelo > Editar HTML e procura por: 

]]></b:skin>

2º Passo: Antes dessa tag cole: 

/***Efeito rotate por one di things***/
.rotate img {border: solid #ddd 5px;
  position:absolute;
  margin-left:-90px;width:200px;-webkit-transition: all 0.4s linear;-moz-transition: all 0.4s linear;}
.rotate img:hover {-moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
3º Passo: Vá em Adicionar um gadget e cole: 
<div class="rotate"><img src="LINK DA SUA FOTO" />

You Might Also Like

2 comentários:

  1. Mudou o cabeçalho?
    Ficou lindo,amei o efeito,vou usar ;)
    xxBatwoman

    ResponderExcluir
  2. Nhaaaw amei o efeito e o cabeçalho está mt divo -q mesmo não curtindo 1D .-.

    Chu ~
    Vagas para Afiliados : http://miss-nothing-oficial.blogspot.com.br/2013/09/vaga-para-afiliados.html

    Visita ? http://miss-nothing-oficial.blogspot.com.br

    ResponderExcluir