Minimalist Success/Error Notification In Vanilla JS – notify.js

Category: Javascript , Notification | August 20, 2019
Views Total:1,403 views
Official Page:Go to website
Last Update:August 20, 2019


Minimalist Success/Error Notification In Vanilla JS – notify.js


notify.js is a minimal, simple-to-use JavaScript notification plugin to show success and error notification popups in the lower right corner of the screen.

How to use it:

Link to the stylesheet notification.css and JavaScript notify.js.

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

By default, the plugin uses Font Awesome for the notification and close icons.

<link rel="stylesheet" href="/path/to/fontawesome/all.css" />

Create a new notification instance, specify the type, and define the title & message displayed in the notification popup.

  // or "error"
  type: "success",
  // title
  title: "Notification Title",
  // message
  message: "Notification Message"

Change the colors and icons of your notification messages.

//Change the color and icon on your notification
if (this.type == "success") {
  icon = "fas fa-check";
  divClass = "success";
  textColor = "#64963b";
} else if (this.type == "error") {
  icon = "fas fa-times";
  divClass = "error";
  textColor = "#963b3b";

You Might Be Interested In:

Leave a Reply