13.1.14

Tutorial-Efeito Vento(Exclusivo!)

   
                                                         Boa Noite Little Rains!
Tudo bem com vocês?Eu estou ótima se alguém quiser saber.Confesso que estou começando a ficar enjoada desse layout,mas gosto tanto dele que estou com dó de trocar T-T ~vai entender~.Enfim,estou escrevendo essas baboseiras só pra ocupar espaço mesmo,já que não tenho oque escrever nesse parágrafo.Então ignorem ele e vão direto para o próximo que é oque fala sobre oque iremos abordar na postagem e tals.O segundo parágrafo é sempre mais importante,portanto vão direto para ele.Oia encheu!

Well,na postagem de hoje eu trouxe um tutorial para vocês!Sei que existem vários blogs de goodies por aí,mas a maioria posta materiais e goodies é uma coisa fácil de postar.Hoje eu trouxe o tutorial de um efeito exclusivo meu chamado efeito vento.O nome meio que tem a ver com o efeito,vou colocar uma preview na postagem.Ah e não se preocupem que eu testei o efeito em um blog de testes meu e deu certinho,porque um outro efeito que eu postei deu tudo errado(não sei se viram isso).Enfim.Curiosos?
                                                            Preview do efeito

1-Vá em modelo >> Editar HTML >> Aperte CTRL+F e procure por ]]></b:skin>

2-Abaixo de ]]></b:skin> cole o código abaixo,mas não edite nadinha
  .vento {
    transition:All 0.6843s ease;
    -webkit-transition:All 0.6843s ease;
    -moz-transition:All 0.6843s ease;
    -o-transition:All 0.6843s ease;
    transform: rotate(0deg) scale(1.009) skew(180deg) translate(55px);
    -webkit-transform: rotate(0deg) scale(1.009) skew(180deg) translate(55px);
    -moz-transform: rotate(0deg) scale(1.009) skew(180deg) translate(55px);
    -o-transform: rotate(0deg) scale(1.009) skew(180deg) translate(55px);
    -ms-transform: rotate(0deg) scale(1.009) skew(180deg) translate(55px);
    }
    .vento:hover{
    transform: rotate(0deg) scale(0.856) skew(165deg) translate(55px);
    -webkit-transform: rotate(0deg) scale(0.856) skew(165deg) translate(55px);
    -moz-transform: rotate(0deg) scale(0.856) skew(165deg) translate(55px);
    -o-transform: rotate(0deg) scale(0.856) skew(165deg) translate(55px);
    -ms-transform: rotate(0deg) scale(0.856) skew(165deg) translate(55px);
    }

3-Salve normalmente.Agora vá em layout >> Adicionar um Gadget >> HTML/JavaScript e cole:
<a href="Seu link" title="Nome"><img src="Url da imagem" class="vento" /></a>
4-Edite as partes sublinhadas e pronto!

Se usar,por favor credite o September Rains.

Obrigada Upsides Down e Louca por HTML por terem me ajudado a criar esse efeito ^^

13 comentários

  1. O efeito é show,gostei!
    Cate-land.blogspot.com.br

    ResponderExcluir
  2. Eu gosto desse layout, é tão fofo ♥
    Amei o efeito, muito lindo, ele é uma versão mais lenta do efeito debaixo certo? Amei ♥
    kiss
    With You || Imperfectous

    ResponderExcluir
    Respostas
    1. Awwn *-* eu tbm gosto dele,mas estou ficando enjoada dele já T-T
      Awwn que bom que gostou *-* é tipo isso,mas a única diferença é q o efeito down fica de cabeça pra baixo ^^

      Excluir
    2. Desculpa, falei errado ashuahsua -q é q o meu navegador é o mozila, e o efeito down fica de cabeça pra baixo nele, mas no google chrome ele fica igual ao vento ^^

      Excluir
  3. Ah vezes me sinto assim também em relação aos layouts que uso! Adorei o efeito, fofinho :3

    Unskilled || World Of Dreams

    ResponderExcluir
    Respostas
    1. Comigo é quase sempre assim T-T awwn que bom q gostou Nae *-*

      Excluir
  4. Awnn, que lindo ♥ O nome combinou bastante, Britty, IUSAHUA' <3

    Ah, não troca o layout não.. Amo tanto este >3<

    Um grande beijo,

    Juu-Chan || Nescau com Nutella

    ResponderExcluir
    Respostas
    1. Owwnt que bom que gostou Juu *-* ashuashua foi meio que instantâneo eu olhei pra ele e pensei "parece uma janela abrindo por causa do vento" aí coloquei vento ashuashua -qq
      Não vou trocá-lo agora >3< só no finalzinho do mês

      Excluir
  5. Vou experimentar esse efeito , parece legal !!! Bjs
    http://pandarise.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Experimenta sim *-* eu gostei bastante dele,espero q goste tbm ;3

      Excluir

Olá! Obrigada por acessar o September Rains, fico feliz em ver que quer deixar um comentário, só peço que:
-Não use palavrões e palavras baixas,
-Não arrume briga com outros usuários,
-Se for para fazer uma crítica, que você seja gentil e que ela seja construtiva,
-Leia o post antes de comentar, ok?
Seguiu todas as regras? Ótimo! Agora pode comentar! Não se esqueça de deixar o link do seu blog, para que eu possa visitá-lo depois.