♥ Eu simplesmente amo AOA, gatas elas não?! ♥
Vamos usar os códigos? (^ ▽ ^) Então, como de sempre vamos em layout >> adicionar um gadget >> Html/JavaScript e cole o código abaixo:
<center>Vamos entender este código:
<a href="LINK DO BLOG" title="NOME DO BLOG"><img class="rotate" src="http://i.imgur.com/Oylg6bR.png" /></a>
<a href="LINK DO BLOG" title="NOME DO BLOG"><img class="rotate" src="http://i.imgur.com/Oylg6bR.png" /></a>
<a href="LINK DO BLOG" title="NOME DO BLOG"><img class="rotate" src="http://i.imgur.com/Oylg6bR.png" /></a>
<a href="LINK DO BLOG" title="NOME DO BLOG"><img class="rotate" src="http://i.imgur.com/Oylg6bR.png" /></a>
<a href="LINK DO BLOG" title="NOME DO BLOG"><img class="rotate" src="http://i.imgur.com/Oylg6bR.png" /></a>
</center>
PS ~> Mude somente os termos destacados!
Onde está link do blog vocês colocaram o url do link desejado, onde está nome do blog é o texto do tooltip (quando passa o mouse) e o termo em negrito será o url da sua imagem.
Agora vocês vão em modelo >> editar html >> click dentro da area dos códigos, dê CTRL + F pesquise por ]]></b:skin> e cole o código abaixo:
.rotate {
margin-top: 4px;
-webkit-transition-duration: .1s;
-webkit-filter: opacity(0.6);
border: 2px solid #ab9b8f;
}
.rotate:hover {
border: 2px solid #efa589;
-webkit-transform: rotate(-30deg);
-webkit-transition:All 2s ease;
-webkit-transition-duration: .45s;
-moz-transition: All 2s ease;
-o-transition: All 2s ease;
-webkit-filter: none;
}
OBS: Para entendermos melhor os códigos, foram usados:
Border: borda da imagem + cor da borda.
Opacity: Opacidade da imagem.
-webkit-transition: Duração e transição de efeito.
-webkit-transform (rotate): rotação da imagem.
Por hoje é só isso cupcakes, talvez a próximo post estarei falando do meu novo layout ou fazendo resenha de dois doramas que terminei recentemente. Espero que usem e tenham gostado! Fiquem com Deus, xoxo e please NÃO REBLOGUEM OU PLAGIEM! (*εε*)
Eu não comi chocolate algum ;-; Não tenho mais "idade" para isso ;-; É o que meu pais dizem.
ResponderExcluirEu amo/sou o Layout do seu Blog de testes <3 É lindo ;u;
Ah! Que efeito fofo <3 <3
>> b-rasiaticos.blogspot.com.br/
- C h u ~
Que pena T_T heuehu mds, eles só podem dizem isso para não exagerar nas doçuras, não?! Fico feliz por ter gostado o layout é inspirado no próximo do MR, obrigada ^v^, xoxo e visitarei seu blog.
ExcluirEu não ganhei muita coisa na páscoa, só duas caixas de bom bom e um ovo, mas o ovo eu dei pra minha mãe, e as caixas de bom bom já acabaram rsrs'
ResponderExcluirEu amei esse menu, eu realmente acho que usarei no meu próximo layout!
|| d i a m o n d s o n g a l a x y ||
Pelo menos não passou em "branco" não é mesmo?! *v* heueh. Obrigada, fico feliz por ter gostado e iria ficar cute, espero que use. Visitarei seu blog, xoxo.
ExcluirEu não ganhei nenhum chocolatezin , mas para não dizer que fiquei totalmente sem ovo da páscoa, antes, bem antes da páscoa eu já tinha comprado meu ovo da Cacau Show acompanhado do meu fone da mulher maravilha, então nem me importei por não ter ganhado nada, meu auto presente já valeu. Ameeei esse menu, ficou muito bacana :D
ResponderExcluirsimplesgarota.com
Awn <|3, mesmo assim saboreou um pouco da páscoa heueh ^3^, obrigada, que bom que gostou Aline. ~Visitarei seu blog, xoxo.
ExcluirJá conhecia o tutorial ele é muito legal eu adoro.
ResponderExcluirBeijokas
Estou seguindo :3
sorriso4met4lico.blogspot.com
Este efeito é bem mesmo, que bom que gostou Paloma. Obrigada por seguir, visitarei seu blog, xoxo ^w^.
ExcluirEu ganhei só uma caixa de bombom que horror! ASHUASHUA! esse efeito é tão fofin! (´・ω・`) beijinhos!
ResponderExcluir{Cotton candy}
Mais bombons também são gostosos heuheueh, Que bom que gostou Yuki (´・ω・`) eu também achei. Visitarei seu blog, xoxo.
ExcluirAmei esse efeito no meu próximo layout ♡
ResponderExcluirQue bom tenshi (=*U*=) muito obrigada e bom uso! ~kisus.
Excluir