27 de fev. de 2013

Imagem hover com efeito arco-íris

733952_549073681792003_2130891040_n_large
~le gordice mode on, malditos me deram fome e.e okay, oi gente \õ
Começando com a maratona de tutoriais, mais um efeito pra imagens! Continue lendo para visualizar e aprender a fazer o efeito.

Bom, quando você passa o mouse por cima da imagem ela fica mudando de cor, fica toda coloridinha, aqui um exemplo das fases:
Faça o "caminho da roça" e procure por ]]></ b:skin>
Logo acima cole:
img { filter: hue-rotate(360deg);
-webkit-filter: hue-rotate(360deg);
-moz-filter: hue-rotate(360deg);
-webkit-filter;(1);
-webkit-transition: all 0.7s linear;
-moz-transition: all 0.7s linear;
transition: all 0.7s linear;}
img:hover {
filter: hue-rotate(0deg);
-webkit-filter: hue-rotate(0deg);
-moz-filter: hue-rotate(0deg);
-webkit-filter;(0);}
os créditos é do mesmo blog da postagem de vários efeitos para fotos, totalmente do blog
http://annyz-kawaii.blogspot.com.br/

Daí é só você visualizar e se estiver tudo igual salve, afinal efeito hover não aparece em visualização.
Bjoks s2s2 

6 comentários:

  1. Gente q meigo *)* vou usar no meu proximo layout que será mais cute!
    Adorei este novo lay!não tinha visto antes!
    Te aguarda lá no meu log viiu?bejão!

    http://alwayspaetes.blogspot.com/

    ResponderExcluir
  2. OMG! Coloquei lá no 1maginer, ficou muito perfa ç.ç

    ResponderExcluir
  3. wow, que perfeito :3 próximo lay que me espere com isso :3 uaheuheu
    Beijos, magicand0.blogspot.com

    ResponderExcluir
  4. Pelo menos creditavas o Annyz Blog!
    Annyz Blog Só para leitores convidados, você está lá.

    ResponderExcluir
    Respostas
    1. oi???? querida eu creditei :D mas como assim só pra leitores convidados? o.O

      Excluir
  5. Obrigada me ajudou muito ..

    Ah eu gameei na decoração nova, ficou perfeita *--*

    Beijão http://paradiseofteen.blogspot.com.br

    ResponderExcluir