Minimalist Stackable Alert Notification Library – Alerter

Alerter is a super tiny JavaScript library used to display simple, clean, stackable, auto-dismiss alert notification boxes on the webpage.

How to use it:

To get started, you have to load the alerter.js in your html document when needed.

<script src="alerter.js"></script>

Display a basic alert notification:

alerter('Hello, World!');

Config the alert notification with the following options.

alerter({
  // optional element id
  id: undefined,
  // optional element class
  class: undefined,
  styles: {
    height: '50px',
    backgroundColor: '#A200FF',
    color: '#FFFFFF',
    fontFamily: 'Segoe UI',
    fontSize: '13px',
    margin: '15px',
    padding: '5px',
    minWidth: '250px'
  },
  duration: 3,
  // these two options are for the fadeOut, and dictate how fast it is
  fadeStep: 5,
  fadeSpeed: 25,
  // show it top right or bottom left? any combination is fine
  xOrientation: 'right',
  yOrientation: 'bottom',
  // when the alert is hidden
  onClose: undefined,
  // when the alert is clicked
  onClick: undefined,
  // whether or not the alert will hide automatically
  autohide: true
  
});

Changelog:

v1.1.0 (09/08/2018)

• Update