Creación de efectos flotantes con animaciones CSS3-Hover. CSS
| Autor: | IanLunn |
|---|---|
| Views Total: | 5,111 |
| Sitio oficial: | Ir a la web |
| Actualizado: | June 11, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Hover. CSS es una colección de efectos Hover con el poder de CSS3 que se puede utilizar para crear animado mouse sobre efectos en cualquier elemento HTML como botones, imágenes y mucho más.
Todos los efectos Hover. CSS hacen uso de un solo elemento (con la ayuda de algunos pseudo-elementos donde sea necesario), son autocontenidos para que pueda copiarlos y pegarlos fácilmente, y vienen en sabores CSS y SASS.
Funcionamiento
Incluya la última Hover. CSS en el documento HTML.
<link href="css/hover.css" rel="stylesheet" media="all">
Agregue la clase de animación a su elemento HTML y listo. Efectos disponibles:
- HVR-Grow : Grow
- HVR-Shrink : reducir
- HVR-pulso : pulso
- HVR-Pulse-Grow : Pulse Grow
- HVR-Pulse-Shrink : reducción de pulso
- HVR-Push : Push
- HVR-pop : pop
- HVR-Bounce-en : rebote en
- HVR-Bounce-out : rebote
- HVR-rotar : Gire
- HVR-crecer-rotar : crecer rotar
- HVR-Float : Float
- HVR-Sink : fregadero
- HVR-Bob : Bob
- HVR-Hang : colgar
- HVR-skew : sesgar
- HVR-sesgo- hacia adelante: inclinación hacia delante
- HVR-skew- hacia atrás: sesgar hacia atrás
- HVR-Wobble-horizontal : Wobble horizontal
- HVR-Wobble-vertical : Wobble vertical
- HVR-Bamboleo-a-abajo-derecha : bamboleo hacia abajo a la derecha
- HVR-Bamboleo-a-arriba-derecha : tambalear a la parte superior derecha
- HVR-Wobble-Top : Wobble Top
- HVR-Wobble-Bottom : bamboleo inferior
- HVR-Wobble-skew : Wobble skew
- HVR-Buzz : Buzz
- HVR-Buzz-out : Buzz out
- HVR-Forward : adelante
- HVR-hacia atrás : hacia atrás
- HVR-fade : fade
- HVR-back-Pulse : pulso de espalda
- HVR-barrido a la derecha : barrido a la derecha
- HVR-barrido a izquierda : barrido hacia la izquierda
- HVR-barrido a fondo : barrido a fondo
- HVR-barrido-a-Top : barrido a la parte superior
- HVR-rebote a la derecha : rebote a la derecha
- HVR-rebote a la izquierda : rebote a la izquierda
- HVR-rebote a fondo : rebote a fondo
- HVR-Bounce-a-Top : rebote a la parte superior
- HVR-radial-out : radial out
- HVR-radial-en : radial en
- HVR-Rectangle-en : rectángulo en
- HVR-Rectangle-out : rectángulo hacia fuera
- HVR-obturador-en-horizontal : obturador en horizontal
- HVR-obturador horizontal : obturador horizontal
- HVR-obturador-en-vertical : obturador en vertical
- HVR-obturador-salida-vertical : obturador vertical
- HVR-Border- de fundido: atenuación de borde
- HVR-Hollow : Hollow
- HVR-Trim : Trim
- HVR-Ripple-out : salida de ondulación
- HVR-Ripple-en : ondulación en
- HVR-Outline-out : delinea
- HVR-contorno-en : contorno en
- HVR-redondo-esquinas : esquinas redondas
- HVR-subrayado-de-izquierda : subrayado desde la izquierda
- HVR-subrayado-desde-centro : subrayado desde el centro
- HVR-subrayado-de-derecha : subrayado de la derecha
- HVR-revelar : revelar
- HVR-underline-revelar : subrayar Mostrar
- HVR-Overline-revelar : Sobrelineado revelar
- HVR-sobrelineado-de-izquierda : Overline desde la izquierda
- HVR-Overline-desde-centro : Overline desde el centro
- HVR-Overline-de-derecha : Overline de la derecha
- HVR-Shadow : Shadow
- HVR-Grow-Shadow : Grow Shadow
- HVR-Float-Shadow : Float Shadow
- HVR-Glow : Glow
- HVR-Shadow-radial : Shadow radial
- HVR-Box-Shadow-Inicio : Inicio de la sombra de cuadro
- HVR-Box-Shadow-recuadro : recuadro de sombra de cuadro
- HVR-Bubble-Top : Bubble Top
- HVR-Bubble-derecha : burbuja derecha
- HVR-burbuja-fondo : fondo de burbuja
- HVR-Bubble-izquierda : Bubble Left
- HVR-Bubble-Float-Top : burbuja Float Top
- HVR-Bubble-Float-Right : burbuja flotante derecha
- HVR-Bubble-Float-Bottom : burbuja flotante inferior
- HVR-Bubble-Float-Left : burbuja flotante izquierda
- HVR-Curl-superior-izquierda : Curl superior izquierdo
- HVR-Curl-parte superior derecha : Curl arriba a la derecha
- HVR-Curl-inferior derecha : Curl abajo a la derecha
- HVR-Curl-inferior izquierda : Curl inferior izquierda
<a rel="grow" class="button hvr-grow">Grow</a>
Registro de cambios
06/11/2018
- v2.3.2
