Minimalist Sliding Toast Notification Library – Toast.js

Category: Javascript , Notification | April 17, 2023
Author:Ralex91
Views Total:165 views
Official Page:Go to website
Last Update:April 17, 2023
License:MIT

Preview:

Minimalist Sliding Toast Notification Library – Toast.js

Description:

Just another toast JavaScript library that offers an easy way to deliver non-obtrusive, sliding & fading toast messages to your users.

How to use it:

1. Load the required Toast.js in the document.

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

2. Display a toast message to users.

toastNotif({
  // toast message
  text: 'Toast Message Here',
  // background color
  color: '#5bc83f',
  // timeout in ms
  timeout: 5000,
  // 'valid', 'error', or 'warning'
  icon: 'valid',
  
});

3. To use your own icons, just deleted the first line in the toast.css and override the default icon classes in the toast.js.

let configIcons = {
    valid: 'fa-circle-check',
    error: 'fa-circle-xmark',
    warning: 'fa-circle-exclamation'
}

You Might Be Interested In:


Leave a Reply