Notificaciones Web de estilo Toast en Vanilla JavaScript-VanillaToasts

Vista prévia

Descripción

VanillaToasts is a lightweight and easy-to-use vanilla JavaScript library for displaying toast-style notifications on your website / web application.

Actualmente admite 4 tipos diferentes de notificaciones: éxito, información, ADVERTENCIA y error.

Funcionamiento

Importa vanillatoasts. CSS y vanillatoasts. js a tu página web.

<script src="vanillatoasts.js"></script>
<link href="vanillatoasts.css" rel="stylesheet"></script>

Cree un mensaje del sistema predeterminado que se deslice desde el lado derecho de la Página Web.

VanillaToasts.create({

title: 'Message Title',

text: 'Notification text',
});

Parámetros opcionales.

VanillaToasts.create({



// notification title

title: 'Welcome to my site',


// notification message

text: 'This toast will hide after 5000ms or when you click it',


// success, info, warning, error
 / optional parameter

type: 'warning',


 // path to notification icon

icon: '/img/alert-icon.jpg',


// auto dismiss after 5000ms

timeout: 5000


 // executed when toast is clicked

callback: function() { ... }

 });

Oculte la notificación del sistema manualmente.

toast.hide()

Establezca el tiempo de espera.

VanillaToasts.setTimeout(toast.id, 2000);

Registro de cambios

07/20/2018

• Se agregó un ID de vanillatoast frente a una regla H4 genérica para evitar que las etiquetas H4 de página normal tengan un estilo no deseado aplicado
• Nueva función para iniciar manualmente el tiempo de espera de un brindis que se creó sin una opción de tiempo de espera