Minimal Notification Popup In Pure JavaScript – notifications.js

Category: Javascript , Notification | March 13, 2018
Author: JamieLivingstone
Views Total: 3,081
Official Page: Go to website
Last Update: March 13, 2018
License: MIT


Minimal Notification Popup In Pure JavaScript – notifications.js


notifications.js is a standalone JavaScript plugin to create beautiful, customizable, flexible notification popups inspired by the jQuery Toastr plugin.


  • 4 position: Top Right, Top Left, Bottom Right, and Bottom Left.
  • Auto dismisses after a timeout.
  • 5 themes: Success, Warning, Information, Error, and Default.

How to use it:

To get started, import the following JavaScript and CSS files into the document.

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

Create a new notification instance.

const myNotification = window.createNotification({
      // options here

Show the notification popup with your own message.

  title: 'Title',
  message: 'Notification Message' 

Possible options to customize the notification popup as per your needs.


  // close on click
  closeOnClick: true,

  // displays close button
  displayCloseButton: false,

  // nfc-top-left
  // nfc-bottom-right
  // nfc-bottom-left
  positionClass: 'nfc-top-right',

  // callback
  onclick: false,

  // timeout in milliseconds
  showDuration: 3500,

  // success, info, warning, error, and none
  theme: 'success'

You Might Be Interested In:

Leave a Reply