arlet-loadding
Version:
Un componente de indicador de carga con múltiples animaciones personalizables.
83 lines (57 loc) • 1.77 kB
Markdown
# Documentación de la Clase ```ArletLoadding```
La clase ArletLoadding es una utilidad para mostrar un indicador de carga en pantalla con diferentes tipos de animaciones. Es altamente personalizable y permite agregar texto descriptivo junto con la animación.
## Propósito
El propósito de esta clase es proporcionar una forma sencilla de mostrar un indicador de carga en aplicaciones web, con soporte para múltiples tipos de animaciones predefinidas.
## Instalación
```bash
npm install arlet-loadding
```
```html
<head>
<link rel="stylesheet" href="ArletLoadding/ArletLoadding.css">
<script src="ArletLoadding/ArletLoadding.js"></script>
</head>
```
## Instanciación
```javascript
const loadding = new ArletLoadding(document.querySelector('body'));
```
## Métodos
### 1. show
```javascript
show({ texto = 'Cargando...', tipo = 'zigzag-lines' })
```
### Descripción
Muestra el indicador de carga con el texto y el tipo de animación especificados.
### Parámetros
* texto (string): Texto que se mostrará debajo del indicador de carga. Por defecto, es 'Cargando...'.
* tipo (string): Tipo de animación que se utilizará. Debe ser uno de los siguientes valores:
* circles
* bubbles
* rotating-diamonds
* expanding-pulses
* zigzag-lines
* sliding-circles
* rotating-bars
* expanding-squares
* rotating-stars
* pulsing-rings
### Ejemplo
```javascript
loadding.show({
texto: 'Cargando datos...',
tipo: 'rotating-diamonds'
});
```
## 2. cerrar
```javascript
cerrar()
```
### Descripción
Cierra y elimina el indicador de carga del contenedor.
### Parametros
Ninguno.
### Ejemplo de uso
```javascript
loadding.cerrar();
```