Reacciones con un toque animado

Y

YamilRH

Esto no lo encontraras en ningún lado a menos que sea publicado por mi.
Lo que hara es que cuando quieras reaccionar a un tema, mensaje o comentario al pasarle el mouse por encima se moverá dándole una animación similar a un gif
Agregar en la plantilla extra.css
CSS:
// HOVER REACTION + add-ons [TH]Reactions Plus
//By YamilRH
.reaction > .reaction-sprite:hover {
    animation: reaction 1.2s;
}
@keyframes reaction{
    0{-webkit-transform:translate(0, 0) rotate(0);
        -ms-transform:translate(0, 0) rotate(0);
        transform:translate(0, 0) rotate(0)
    }
    20%{-webkit-transform:translate(-3px, 0) rotate(-25deg);
        -ms-transform:translate(-3px, 0) rotate(-25deg);
        transform:translate(-3px, 0) rotate(-25deg)
    }
    30%{-webkit-transform:translate(3px, 0) rotate(25deg);
        -ms-transform:translate(3px, 0) rotate(25deg);
        transform:translate(3px, 0) rotate(25deg)}
    50%{-webkit-transform:translate(-3px, 0) rotate(-15deg);
        -ms-transform:translate(-3px, 0) rotate(-15deg);
        transform:translate(-3px, 0) rotate(-15deg)
    }
    60%{-webkit-transform:translate(3px, 0) rotate(15deg);
        -ms-transform:translate(3px, 0) rotate(15deg);
        transform:translate(3px, 0) rotate(15deg)
    }
    100%{-webkit-transform:translate(0, 0) rotate(0);
        -ms-transform:translate(0, 0) rotate(0);
        transform:translate(0, 0) rotate(0)
    }
}
Compatible con el addons [TH]Reactions Plus de ThemeHouse
 
Atrás
Arriba