Notey-Fi - A Small Simple Notification Plugin

A notification system for displaying, well, notifications.

Its simple to use, just attach a click event or a form submission:

	// Settings: Notice Type, Duration, Message, Noticiation ID
	$('.notey-fi__wrapper').noteyfi("notice", 3000, "This is a Notice.", "notice");

The plugin features are:

There are four built-in types

	// Settings: Notice Type, Duration, Message, Noticiation ID
	$('.notey-fi__wrapper').noteyfi("Success", 3000, "This is a Success.", "success");

	// Settings: Notice Type, Duration, Message, Noticiation ID
	$('.notey-fi__wrapper').noteyfi("Error", 3000, "This is a Error.", "error");

	// Settings: Notice Type, Duration, Message, Noticiation ID
	$('.notey-fi__wrapper').noteyfi("Warning", 3000, "This is a Warning.", "Warning");

	// Settings: Notice Type, Duration, Message, Noticiation ID
	$('.notey-fi__wrapper').noteyfi("notice", 3000, "This is a Notice.", "notice");

Download the plugin from Github Repo

Include this inside the

	<!-- // Place inside the <head> of your document // -->
	<link href="/path/to/notey-fi.css" rel="stylesheet" type="text/css">
	<script src="/path/to/jquery.notey-fi.js"></script>

view raw Notey-Fi Header hosted with ❤ by GitHub

Add the notification wrapper "notey-fi__wrapper"

	<!-- // Place inside the <body> of your document // -->
	<div class="notey-fi__wrapper"></div>

view raw Notey-Fi Markup hosted with ❤ by GitHub

Apply the ** to fire off a notification

	// Settings: Notice Type, Duration, Message, Noticiation ID
	$('.notey-fi__wrapper').noteyfi("notice", 3000, "This is a Notice.", "notice");

The plugin comes with a few settings

Option	Description
Type	Choose from the four predefined types ("Success", "Error", "Warning" and "Notice") You can add custom ones just by creating new classes within your CMS, The class name needs to match up to the "Type". (e.g. "notey-fi__success" etc)
Duration	Set the duration the notification will display for. Use milliseconds for its value.
Text	Write your notification message here, you cna use HTML in this string.
ID	Set the id of the notification.

View source code over at github

Github

Downlaod the souce code in a .zip file