Toast Notification With Timer In Vanilla JavaScript – notify-js

Category: Javascript , Notification | April 15, 2019
Author:BasWilson
Views Total:1,941 views
Official Page:Go to website
Last Update:April 15, 2019
License:MIT

Preview:

Toast Notification With Timer In Vanilla JavaScript – notify-js

Description:

notify-js is a vanilla JavaScript notification library for displaying growl- and toast-like notification messages on the webpage.

Features:

  • Custom styles.
  • With countdown timer.
  • Specified timeout.

See also:

How to use it:

Import the main JavaScript notify-js.js in the document.

<script src="notify-js.js"></script>

Create a basic toast notification which will automatically dismiss after 3 seconds.

new NotifyJS({
    message: "Default notification"
})

Customize the timeout in milliseconds. Defaults to 3000ms.

new NotifyJS({
    message: "Default notification",
    duration: 5000
})

Enable a countdown timer inside the toast notification.

new NotifyJS({
    message: "Default notification",
    duration: 5000,
    timer: true
})

Apply custom CSS styles to the toast notification.

new NotifyJS({
    message: "Default notification",
    duration: 5000,
    timer: true
},
{
    color: 'rgb(245,233,23)',
    textColor: 'crimson',
    fontFamily: 'Open Sans',
    customCSSBox: `border-bottom: 3px solid salmon; background-color: rgb(106, 0, 255);`
})

You Might Be Interested In:


Leave a Reply