A notification system to display errors, warnings, confirmations and notifications to the user

• Styles
• Animations
• Interactions
• Positions
• Icons

Using bower

bower install backbone.ui.alert

In its basic implementation, the plugin is available under the Backbone.UI namespace

var alert = new Backbone.UI.Alert({
	message : $(e.target).attr("title"),
	type: "success"
});

You can control the fade out animation and the style of the alert through the options.

These are the variables that give you access to a number of features of the plugin

• parentEl: (default: "body" ),
• message: (default: ""),
• type: (default: "info"),
• position: (default: "top-center"),
• fade: (default: 0),

The example Icons, demonstrates how to add icons to the alerts and can be used as is, or customised if desired. The codes for the icons are as follows:

Success: e600 Error: e602 Warning: e604

Success: e601 Error: e603 Warning: e605

For exact usage, please refer to the css in the header of the example file.

To allow for customisation of the iconfont, the sources selection.json is available in the src/font folder, along with the svg files of the iconfont.

A few of the sites using this open source:

Initiated by Lyndel Thomas (@ryndel)

Distributed through Makesites.org

Released under the MIT license