Biblioteca JavaScript para crear animaciones de transformación entre iconos-Iconate
| Autor: | bitshadow |
|---|---|
| Views Total: | 2,236 |
| Sitio oficial: | Ir a la web |
| Actualizado: | May 13, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
Iconate es una biblioteca de JavaScript ligera que le ayuda a crear animaciones de transformación de CSS3 impulsadas entre iconos. Actualmente admite 19 tipos de animación, puede agregar su propia animación en el iconate. CSS.
Funcionamiento
Incluya el iconate. min. CSS en la sección head del documento. El archivo CSS incluye 19 animaciones de fantasía predefinidas creadas por las transformaciones CSS3:
- Rollrotundo
- rollOutLeft
- Elástica
- zoomOut
- zoomIn
- fadeOut
- Faderotundo
- fadeOutLeft
- fadeOutTop
- fadeOutBottom
- horizontalFlip
- verticalFlip
- bounceOutBottom
- bounceOutTop
- bounceOutLeft
- Bouncerotundo
- rotateClockwise
- rotateAntiClockwise
- Entonces
Incluya la biblioteca de JavaScript iconate. js en su documento.
<script src="dist/iconate.js"></script>
El código JavaScript para crear una animación de transformación básica entre iconos.
var iconElement = document.getElementById('icon'); // selector
var options = {
// Current icon class name
from: 'fa-bars',
// Final icon class name
to: 'fa-arrow-right',
// animation type
animation: 'zoomOut'
};
iconate(iconElement, options); API completa.
// ELEMENT: Icon Element to perform operations on. // CALLBACK: Optional callback to execute after animation completes. iconate(ELEMENT, OPTIONS, CALLBACK)
