JQueryPNotify

Homepage: http://sciactive.com/pnotify/
Author(s): Hunter Perrin
Version: 1.2.0

Full featured plugin to show temporary floating messages for status updates, actions and errors.

Usage

Call $.pnotify(options) to show a notification.

Most common options:

• title: the title
• text: the message text
• delay: milliseconds to show the message
• opacity: value from 0 (fully transparent) to 1 (opaque)
• nonblock: true if items below the message should be clickable
• type: 'error' if an error message

Option	Comment	Default value
addclass	Additional classes to be added to the notice (for custom styling)	""
hide	After a delay, remove the notice	true
before_close	called before a message is closed
after_close	called when a message has been closed
before_open	called when a message is about to be closed
after_open	called when the message has been displayed
insert_brs	Change newlines to br tags	true
cornerclass	Class to be added to the notice for corner styling.	""
nonblock	Create a non-blocking notice; it lets the user click elements underneath it	false
delay	Delay in milliseconds before the notice is removed	8000
shadow	Display a drop shadow	false
history	Display a pull down menu to redisplay previous notices, and place the notice in the history	false
after_init	function called when the message has been initialized
before_init	function called when the message is being initialized
min_height	Minimum height of the notice; it will expand to fit content	"16px"
closer_hover	Only show the closer button on hover.	true
sticker_hover	Only show the sticker button on hover.	true
opacity	Opacity of the notice	1
closer	Provide a button for the user to manually close the notice	true
sticker	Provide a button for the user to manually stick the notice.	true
remove	Remove the notice's elements from the DOM after it is removed	true
mouse_reset	Reset the hide timer if the mouse moves over the notice	true
icon	Set icon to true to use the default icon for the selected style/type, false for no icon, or a string for your own icon class.	true
animate_speed	Speed at which the notice animates in and out; "slow", "def" or "normal", "fast" or number of milliseconds	"slow"
animation	The animation to use when displaying and hiding the notice. "none", "show", "fade", and "slide" are built in to jQuery. Others require jQuery UI. Use an object with effect_in and effect_out to use different effects.	"fade"
text	The notice's text	false
title	The notice's title	false
nonblock_opacity	The opacity of the notice (if it's non-blocking) when the mouse is over it	0.2
stack	The stack on which the notices will be placed. Also controls the direction the notices stack.	{"dir1": "down", "dir2": "left", "push": "bottom", "spacing1": 25, "spacing2": 25}
type	Type of the notice. "notice", "info", "success", or "error"	"notice"
styling	What styling classes to use. (Can be either jqueryui or bootstrap.)	jqueryui
text_escape	Whether to escape the content of the text. (Not allow HTML.)	false
title_escape	Whether to escape the content of the title. (Not allow HTML.)	false
width	Width of the notice	"300px"

See for examples the plugin example page.

The plugin uses the jQuery UI CSS library for styling, which means it is fully and easily themeable.

Examples

• a simple notice
• a simple info
• a success message
• an error message
• a customized one
• an animated info message