♔ E ai, gente bonita, gente bacana, gente legal ♔
E novamente eu estou adoentada, marquem mais um dia ai na listinha. Mas, mesmo doente, a três dias seguidos, venho para casa acompanhada de duas amigas cantando/berrando no meio da rua músicas extremamente ridículas como "Aonde está a baleia?" que aprendemos na quinta série. Desta vez, enquanto cantava-mos, meus vizinhos nos olhavam mais ou menos assim.
Cantorias á parte, hoje trouxe um tutorial que foi pedido umas duas vezes em minha ask : Um tutorial de pôr esse efeito "hover" que tenho no blog. Quer testar? ponha o mouse no bg/header, ou nos posts; depois, tire o mouse da página. Então, verá essa diferença:
Normal
Hover
Normal
Hover
Você irá achar as tags derivadas de " Body { ". Então, você vai colar isso no lugar de body{ :
body, html {
height: *tamanho da sua imagem para primeiro back*px;
margin: 0;
padding: 0; }
body {
font: $(body.font);
color: $(body.text.color);
background: url("*primeiro background*") no-repeat; -webkit-transition-duration: .90s; }
body:hover {
font: $(body.font);
color: $(body.text.color);
background: url("*hover do primeiro bg*") no-repeat;
-webkit-transition-duration: .90s;}
html {
background: url("*2° bg (plano de fundo do blog)*) repeat; -webkit-transition-duration: .90s; }
html:hover {
background: url("*hover do segundo bg*")repeat;
-webkit-transition-duration: .90s;}
a:link {
text-decoration: none;
color: #e3938b;
}
Sugiro que apenas mude o que está destacado em negrito, para que o efeito fique mais agradável. Caso prefira, troque os números "90", destacados em itálico, por um número entre 76 e 90.
O resto do código, creio que esteja bem explicadinho, mas caso haja dúvidas, estarei aqui.
Espero que tenham gostado e entendido tudo certinho.
Icons - Taeyeon
♥ Tamanho: 150 x 150 ♥
♥ Efeito : PSD criado por mim e action também criado por mim. ♥
♥ Efeito : PSD criado por mim e action também criado por mim. ♥
Desculpe, são poucos icons, por esse motivo, resolvi juntar os dois posts. Espero que não tenha problemas.
Beijos >3<
Beijos >3<
O tutorial ficou lindo, vou usar no meu próximo lay ^^
ResponderExcluirOs seus icons ficaram lindos *0*
Ain, obrigada ♥
ExcluirAi, justo o que eu precisava. Vi aqui no blog e fiquei louca, KKKKKKKKK. Obg.
ResponderExcluirsajlkhdsajkh Faça bom uso, e obrigada ^^
ExcluirDonte? De novo? ;c
ResponderExcluirMelhoras.
Ai mds, nunca vi esse efeito em nenhum blog. É tão legal de ficar passando o mouse -qn
E os icons ficaram perfeitos, como todos. Eu sou apaixonada por esse efeito *0*
Pois é né, dessa vez não é preguiciti -q.
ExcluirSUAHSUAHAS obrigada ,3
Que tutorial divo, OMG *OO* Eu sempre via no blog da Roberta, o Cake Pop e sempre quis aprender ♥ Obrigada pelo tuto, diva o3o'
ResponderExcluirAwnnnnnnn, perfeitos os icons u-u Essa Taeyeon, perfeita, cara !
Beijinhos,
Juu-Chan ;3 | Nescau com Nutella ♥
skjhsakj Obrigada. É, o que a Rô usa é apenas o cabeçalho, ainda não sei fazer isso, sasadhgjhdsa.
ExcluirDe nada ^^
Obrigada, e é, ela é linda de bonita o3o
*O* Que efeito lindo que fica ;) Acho que usarei num próximo layout meu *-*
ResponderExcluirOs icons estão maravilhosos :)) A Taeyeon é super bonita e esse psd e action são diwos ;)
Kiss~
from Niik ll Letter of Pain (perfil)
Ai, obrigada <3
ExcluirFica a vontade U_U
E obrigada de novo, sdlakhdsa.