03/09/2013

Saturação hover nas imagens

Olá! Ontem o blog fez um ano! Estou muito feliz por isso, apesar de ser meio chato nesse tempo todo ter poucas postagens. Bom, ontem pediram na ask o efeito usado nas imagens do layout da Demi Lovato pra deixar a imagem com "cores mais vivas" quando se passa o mouse. É bem fácil de aplicar no blog.
Clique aqui para visualizar o efeito
No HTML do seu blog procure por ]]></b:skin> e cole isso acima:
.post img {
opacity: 1;
-webkit-filter: saturate(1);
-webkit-transition-duration: 0.40s;
}
.post img:hover {
opacity: 0.8;
-webkit-filter: saturate(1.5);
}
Salve e pronto, todas as imagens dos posts ficarão com esse efeito.

Também tem a opção de usar em outro lugar do blog mais específico, e para isso basta trocar o ".post img" pelo item que deseja que fique com esse efeito, já até falei sobre isso nesse post aqui.

Mas é isso, caso tenham alguma dúvida é só comentar. Espero que tenham gostado!

14 comentários

  1. Um ano de blog ? Parabéns, haha, não vejo problema em ter apenas 97 postagens, acho que não da pra ficar o dia inteiro no blog, temos uma vida fora da blogosfera também e as vezes fica difícil atualizar sempre. Uma das coisas que mais gosto em blogs, são efeitos, adorei, haha. Eloísa do Having Cherry || Aguardo sua visita

    ResponderExcluir
  2. Seu layout está muito lindo, não sei se eu comentei, *u* Parabéns pelo aniversário do blog, espero que venham muitos outros anos felizes <3 Eu achei o tutorial super útil e fácil, além de dar um charme muito lindo, :3

    ResponderExcluir
  3. É, eu vi que ele fez 1 ano pelo 'sobre' haha. Parabéns, eu acho esse efeito muito perfeito.. gosto muito. Da uma cor linda para as imagens. Prisoner é fã de The Wanted, haha.
    bjs

    ResponderExcluir
  4. Parabéns.Mês que vem meu blog também faz um ano *0*
    Muito legal o efeito,acredito que vou usar no meu próximo layout.

    ResponderExcluir
  5. Parabéns!O blog é perfeito *-*
    Amei o efeito eu estava a procura dele um tempão.Inclusive já estou usando u-u.

    ResponderExcluir
  6. Parabéns pelo blog! Depois você compensa com outras postagens ç3ç
    O layout free é lindo :33
    Ótimo tutorial >u<

    Beijos, Duda || ☆ SD

    ResponderExcluir
  7. AMO O SEU BLOG, ELE É MUITO LINDO ESTOU ESCREVENDO EM CAPS LOOK PQ EU ESTOU MUITO APAIXONADA POR ELE ME DA? *u* booom eu amei esse efeito vou usar hehe : ) e estou te seguindo agora ta com vc!!

    http://www.worldshone-oficial.blogspot.com/

    ResponderExcluir
  8. Tuto lindo <3 amo amo , uso em meus lays free.

    http://euamotutoriais.blogspot.com.br/

    ResponderExcluir
  9. Anwwwwwwwwwwwwwwwwwwwwww, parabéns pelo 1 ano de blog! Muitos anos de sucesso para o TT *-*
    Ameeeeeeeeeeeeeeeei demais esse efeito, de verdade! Vou usar no próximo lay, certeza hahaha >3<
    Beijos ♡ ~
    Garotas Atrevidas ~ retribui a visita? >3<

    ResponderExcluir
  10. Que bom, estava procurando isso!
    Obrigadinhaa =D

    Segue? Por favor? *o*
    http://words-of-ricci.blogspot.pt/

    ResponderExcluir
  11. Parabéns pelo um aninho! Que venha muitos mais pela frente! Não são poucas postagens, e mesmo que seja ao seu ver são de ótima qualidade e muito boas.

    Bunny Crazy

    ResponderExcluir
  12. Conhecei o blog recentemente mais é muito bom e tem me ajudado muito to aqui desejando feliz aniversario de um ano do blog atrasado(hihi) e brigada pelo tuto vai ajudar bastante bjs!

    ResponderExcluir

✧ Por favor, evite comentários não relacionados ao post.

✧ Caso comecem a surgir comentários contendo ofensas ou causando mal-estar, a moderação de comentários será ativada imediatamente.

✧ O blog está desativado, por isso não aceita afiliados, tags e afins.

« »