11 de jul de 2013

Efeito - Here is

| |

Nossa gente, estou tão feliz! *-*
Fiz meu primeiro efeito e adivinhem: ele deu certo *-*


Palmas para mim u_u obrigada -q
Enfim, ele é bem simples e espero que vocês me deem um desconto porque como eu já disse: é o meu primeiro ><
É o gadget here is, e nele tem duas versões do efeito.


Versão 1:
Aplique esse código logo acima da tag ]]></b:skin>

.hereis {
-webkit-transition: 0.4s;
-webkit-border-radius: 20px;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius: 20px;
-moz-border-radius-bottomright: 0;
border-radius: 20px;
border-bottom-right-radius: 0;
padding: 3px;
border: solid 1px #919191;
}
.hereis:hover {
-webkit-transition: 0.4s;
padding: 3px;
border: solid 1px #919191;
opacity: 0.7;
-webkit-border-radius: 0;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius: 0;
-moz-border-radius-bottomright: 0;
border-radius: 0;
border-bottom-right-radius: 0;
-webkit-transform: translatey(-5px);
}

E em um gadget HTML/JavaScript, cole esse código: 

<a href="Link" title="título"><img src="Link da imagem" class="hereis" />

Versão 2:
Acima da tag ]]></b:skin> 

.hereis2 {
-webkit-transition: 0.4s;
-webkit-border-radius: 20px;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius: 20px;
-moz-border-radius-bottomright: 0;
border-radius: 20px;
border-bottom-right-radius: 0;
padding: 3px;
border: solid 1px #919191;
}
.hereis2:hover {
-webkit-transition: 0.4s;
padding: 3px;
border: solid 1px #919191;
opacity: 0.7;
-webkit-border-radius: 0;
-webkit-border-bottom-right-radius: 0;
-moz-border-radius: 0;
-moz-border-radius-bottomright: 0;
border-radius: 0;
border-bottom-right-radius: 0;
-webkit-transform: translate(-5px);

Em um gadget HTML/JavaScript: 

<a href="Link" title="título"><img src="Link da imagem" class="hereis2" />

Só peço uma coisa: se forem repassar, avisem antes nos comentários pra eu saber quem reblogou e ver se colocou os créditos, apesar do efeito ser simples ele deu muito trabalho para mim que nem sabia onde colocava o código opacity: 0.7; xD
Beijos :*

8 comentários:

  1. eu ainda stou a ver se um efeito que eu faça de certo, mas u dia da certo espero
    gostei do efeito :3

    ResponderExcluir
    Respostas
    1. Se eu consegui, você também consegue xDDD
      obrigada :3

      Excluir
  2. WOW adorei de paixão os efeitos e-e Beijos~
    Trufa-de-menta :3

    ResponderExcluir
  3. Adorei demais!! ><
    E é fácil de fazer, obrigada por postar *u*

    ResponderExcluir

- Não xingue ninguém, pois toda ação tem uma reação.
- Não julgue a opinião dos leitores. Se fizessem isso com você, você não gostaria, certo?
- Não peça pra seguir de volta ou visitar seu blog. É deselegante.
- Não xingue meu blog. Ele é feito com muito esforço, e não gosto de ninguém "pisando" nele :)