Custom Alert Notification Plugin For jQuery - iao-alert

File Size: 10.5 KB
Views Total: 11059
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Custom Alert Notification Plugin For jQuery - iao-alert

iao-alert is a lightweight, flexible, customizable jQuery plugin for creating animated, toast- or growl style alert notifications on the webpage.

Main features:

  • 2 themes: light and dark.
  • 4 notification types: success, error, warning and default.
  • Fade in/out animations.
  • Fade out notification on hover.
  • Auto dismiss after a timeout (default: 3 seconds).
  • Close button.
  • Can be positioned anywhere on the webpage.

Basic usage:

1. To use the jQuery iao-alert plugin start with adding the following JS and CSS files in your html document.

<link href="iao-alert.css" rel="stylesheet">
<script src="//"></script>
<script src="iao-alert.jquery.js"></script>

2. The JavaScript to create a default ioa alert message:

  msg: "This is default iao alert message."

3. Set the notification type.


  // or success, error, warning
  type: "notification"


4. Enable / disable auto dismiss.


  // false = close auto-dismiss
  autoHide: true,

  // timeout in milliseconds
  alertTime: "3000",


5. Change the default position where you'd like to place the alert notifications.


  // or top-left, bottom-right, bottom-left
  position: 'top-right'


6. More configuration options with default values.


  // default message
  msg: "This is default iao alert message.",

  // or 'success', 'error', 'warning'
  type: "notification",

  // or dark
  mode: "light",

  // auto hide
  autoHide: true,

  // timeout in milliseconds
  alertTime: "3000",

  // fade animation speed
  fadeTime: "500",

  // shows close button
  closeButton: true,

  // close on click
  closeOnClick: false,

  // custom position
  position: 'top-right',

  // fade on hover
  fadeOnHover: true,

  // rounded corners
  roundedCorner: false,

  // z-index
  zIndex: '999',

  // additional CSS class(es)
  alertClass: ''




  • Added more options


  • Adding custom class functionality


  • Correction in the rounded Corner bug


  • adding zIndex option control.

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