CSS3 notificaciones de alertas animadas-JSAlert
| Autor: | baraaabdelsalam |
|---|---|
| Views Total: | 2,778 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 10, 2017 |
| Licencia: | MIT |
Vista prévia
Descripción
JSAlert es una biblioteca de JavaScript Vanilla para ayudar a crear notificaciones de alerta personalizables con animaciones CSS3 impulsadas por < a href = "https://daneden.github.io/animate.css/" target = "_ blank" rel = "noopener noreferrer" > Animate. CSS .
Funcionamiento
Cargue el JavaScript principal y la hoja de estilos de JSAlert en su documento.
<link rel="stylesheet" href="css/main.css"> <script src="js/main.min.js"></script>
Cree un elemento para colocar las alertas de notificación.
<div id="alertBtns"> </div>
Cree un botón de alternancia para mostrar las alertas de notificación. Todas las opciones de configuración se pueden pasar a través de atributos de datos HTML.
<button data-animate-start="bounceInRight" data-animate-end="bounceOutRight" data-text-color="white" data-bg-color="#00bcd4" data-placement="right" data-content="Top Right Alert" onclick="makeAlert(this)" class="wf-alert-btn"> Click Me </button>
