[TUTORIALES]2 Efectos de imagenes{2}

Hola pollitos lindos?Como estan?? Yo espero que genial...yo estoy algo...no se, este sabado es la boda de mi hermana...asi que la tencion se acumula. Ademas hoy me puse el traje que usare{para ver si me quedaba}y saben lo que paso???Adelgase mas de lo que queria,y ahora me queda grande.....si si...y no puedo cambiarlo~mi hermana dijo que no comiera nada y me quedara asi.jejej me dio risa,por que se supone que sea una situacion de felicidad,pero no dias antes de una boda...pero ni modo no dejare de hacer ejercisio...bueno...hoy les traigo una tutorial....espero que les guste mucho:

1.EFECTO #1
Preview "AQUI".

Buscamos ]]></b:skin> arriba de ese codigo colocamos lo siguiente:
.up{
padding:2px;
border: 3px solid #ffffff;
-webkit-box-shadow: 0px 0px 5px #c7c7c7;
-moz-box-shadow: 0px 0px 5px #c7c7c7;
box-shadow: 0px 0px 5px #c7c7c7;
margin:1px;
width:50px !important;
height:50px !important
opacity: 0.7;
padding: 1px;
border-radius: 2px;
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
filter: grayscale(0%);
-webkit-transition-duration: .99s;
-moz-transition-duration: .99s;
-webkit-transition-duration: .70s;
}
.up:hover{
OPACITY: 0.3; outline-style: transparent;
-webkit-filter: saturate(0%);
-moz-filter: saturate(0%);
-o-filter: saturate(0%);
-ms-filter: saturate(0%);opacity: .43;
-webkit-transition-duration: .40s;
-webkit-transform: rotate(360deg) scale(1.1) ;
-webkit-transform: rotateX(350deg) rotateY(0deg) rotateZ(0deg);
-moz-transform: rotateX(350deg) rotateY(0deg) rotateZ(0deg);
-o-transform: rotateX(350deg) rotateY(0deg) rotateZ(0deg);
-ms-transform: rotateX(350deg) rotateY(0deg) rotateZ(0deg);
transform: rotateX(350deg) rotateY(0deg) rotateZ(0deg);
}
Abrir un gadget HTML y copiar este codigo:
<a href="Link" target="_blank" title="titulo"><img class="up" src= "url imagen"/></a>
2.EFECTO #2
Preview "AQUI"

Buscamos ]]></b:skin> arriba de ese codigo colocamos lo siguiente:
@-webkit-keyframes woll{
50% {
transform: rotate(700,deg) ;
-webkit-transform: rotate(100deg) ;
-moz-transform: rotate(9deg) ;
-o-transform: rotate(10deg) ;
-ms-transform: rotate(44deg) ;
}
75% {
transform: rotate(7deg);
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
-ms-transform: rotate(-10deg) ;
}
100% {
transform: rotate(7deg) ;
-webkit-transform: rotate(7deg) ;
-moz-transform: rotate(7deg) ;
-o-transform: rotate(+44deg) ;
-ms-transform: rotate(+44deg) ; }
}
.woll{
border:1px solid #ccc;
padding: 1px;
-webkit-transition-duration: .50s;
OPACITY: 1;
outline-style: transparent;
}
.woll:hover{
-webkit-animation: woll .5s alternate linear;
OPACITY: 0.7;
outline-style:transparent;
}
Abrimos un gadget HMTL y pegas el siguiente codigo:
<a href="Link"><img class="woll" src="url imagen" title="titulo" /></a>
Espero que les guste,estos efectos son geniales...les estare compartiendo mas{si es que quieren}Bueno... No tengo nada mas que decir,estare pasando por sus blogs^3^
Recuerda dejar tu comentario~
Les deejo besos de cherryT.O.P
Att:Lee rae mi{dayi}

9 comentarios:

  1. Hola!!

    uuyy que mono!! adoro esos efectos!!! :D

    ResponderEliminar
  2. Estan muy chulos esos efectos, asi que gracias por el tutorial! y vaya faena que el vestido ahora te quede grande pero bueno, seguro que aún asi lo lucirás muy bien ^^
    Saludoss!

    ResponderEliminar
    Respuestas
    1. al final me quedo bien..un poco grande,pero bien~!!
      saludos

      Eliminar
  3. me encantaron los efectos sobretodo el primero esta muy genial!

    ResponderEliminar
  4. Hola!
    Están super chulos los efectos.
    Gracias por el tutorial.
    Besos

    ResponderEliminar
  5. ♡Hola♡ Me encantaron los efectos (por cierto soy Vanni sólo que con otra cuenta :) Espero te pases por mi blog , trataré de entrar más seguido al tuyo ya que tengo vacaciones.

    ♡Besos♡

    ResponderEliminar
    Respuestas
    1. waaa eres tu, pense que era otra persona,gracias por pasar y comentar^3^
      saludos

      Eliminar

Puedes dejar cualquier tipo de comentario(*≧m≦*)Pero si el comentario no es de gusto del blog sera borrado..
No insultes.
No spam(;¬_¬)
Si tienes algo que decirme privado:
dayi123466@gmail.com