Growl Style Message Toaster Plugin For jQuery - notify

File Size: 48.1 KB
Views Total: 9567
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Growl Style Message Toaster Plugin For jQuery - notify

Yet another jQuery plugin to present growl-like, easy customizable toast messages that provides 'info', 'error', 'warning', 'alert', and 'success' styles.

See also:

How to use it:

1. Add reference to the latest jQuery JavaScript library.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

2. Add reference to jQuery notify.js plugin's stylesheet.

<link href="css/jquery.notify.css" rel="stylesheet">

3. Add reference to jQuery notify.js plugin's script.

<script src="js/jquery.notify.min.js"></script>

4. Call the function to display a default alert box in the upper-right corner of the web page

notify({

//alert | success | error | warning | info
type: "alert", 
title: "jQuery.Notify",

//custom message
message: "Super simple Notify plugin.",

position: {

  //right | left | center
  x: "right", 

  //top | bottom | center
  y: "top" 
},

// notify icon
icon: '<img src="images/paper_plane.png" />', 

//normal | full | small
size: "normal", 

overlay: false, 
closeBtn: true, 
overflowHide: false, 
spacing: 20, 

//default | dark-theme
theme: "default", 

//auto-hide after a timeout
autoHide: true, 

// timeout
delay: 2500, 

// callback functions
onShow: null, 
onClick: null, 
onHide: null, 

//custom template
template: '<div class="notify"><div class="notify-text"></div></div>'

});

Change log:

2015-01-22


This awesome jQuery plugin is developed by CreativeDream. For more Advanced Usages, please check the demo page or visit the official website.