Simple jQuery alert

About

Simple jQuery alert that is just that - really simple

Use it to give feedback to your users when they have updated a page for example.

Features

There are three types of alert:

  1. Success
  2. Error
  3. Information

The alert can fade away after a specified amount of time

The alert can be clicked to fade away

Usage

Include the CSS and plugin files in your header


<link href="css/alerts.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/alerts.js"></script>

To call simply add this function call:


$('.msg').simpleAlerter();

You can pass in a parameter which is the number of seconds (in millisecons) for which to display the alert. If you leave it blank the alert will stay on screen until clicked


$('.msg').simpleAlerter(5000);

And then apply the class of "msg" and either success, error or information to your html element. For example:


<p class="success msg">This is a success alert on a paragraph</p>
<div class="error msg">This is an error alert on a div</div>
<ul>
<li class="information msg">This is an information alert on a list item</li>
</ul>

Demo

This is a success alert

Click here to see a demo (fades away after 5 seconds)

Download

Click here to download the source code