ToastJS Notifications

Tipos de Notificaciones

showToast.info("Mensaje de información");

Posición de las Notificaciones

Duración de las Notificaciones

Instalación

La librería ToastJS Notifications es muy fácil de usar desde CDN y también muy fácil de configurar solo con las opciones que necesites.

CDN

<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>ToastJS Notifications con CDN</title>
  </head>
  <body>
    <button id="show-toast">Mostrar Toast</button>

    <script src="https://cdn.jsdelivr.net/npm/toastjs-notifications@latest/toast-notifications.min.js"></script>
    <script>
      document.getElementById('show-toast').addEventListener('click', () => {
        showToast.success('Hola a todos los Devs de JavaScript!', {
          position: 'top-right',
          duration: 5000
        });
      });
    </script>
  </body>
</html>