Bubble & Slide Notification Library – watnotif

The watnotif JavaScript library lets you create growl-style notifications with Bubble & Slide and Unstretch animations.

Installation:

# NPM
$ npm install watnotif
# Bower
$ bower install watnotif

How to use it:

Load a theme CSS of your choice in the document.

<link rel="stylesheet" href="<animation you want>/<position you want>.min.css">

Load the core JavaScript file “watnotif-1.0.min.js” before the closing body tag.

<script src="watnotif-1.0.min.js"></script>

Create default notifications as these:

var successNotif = new Notif("Success Message", "success");
var errorNotif = new Notif("Error Message", "error");
var confirmedNotif = new Notif("Confirm Message", "confirmed");
var defaultNotif = new Notif("Default Message", "default");

Override the default duration parameter:

document.addEventListener('DOMContentLoaded', function() {
  Notif.setWrapperOptions({ 
    duration: 2500 
  });
}, false);