jQuery Plugin For Handling Bootstrap Alerts - Inflop

Inflop is an easy-to-use jQuery plugin helps you create customizable, auto-dismissable info/ error / warning / danger / success / custom feedback messages using Bootstrap Alerts component.

Basic usage:

1. Load the JavaScript file jquery.inflop.bootstrap.alert.min.js into your Bootstrap project.

<script src="//code.jquery.com/jquery-2.1.4.js"></script>
  ...
<script src="Scripts/jquery.inflop.bootstrap.alert.min.js"></script>

2. Create a dismissable 'info' feedback message on the web page.

// showBootstrapAlertInfo(Message, contentType, dissmisable, timeout);
$('#el').showBootstrapAlertInfo('Message Here', Bootstrap.ContentType.Text, true);

3. Create a 'warning' feedback message on the web page that will auto dismiss after a timout (5000ms).

// showBootstrapAlertWarning(Message, contentType, dissmisable, timeout);
$('#el').showBootstrapAlertWarning('Message here', Bootstrap.ContentType.Text, false, 5000);

4. Create a dismissable 'danger' feedback message on the web page that will auto dismiss after a timout (5000ms).

// showBootstrapAlertDanger(Message, contentType, dissmisable, timeout);
$('#el').showBootstrapAlertDanger('Message here', Bootstrap.ContentType.Text, true, 5000);

5. Create a 'success' feedback message on the web page that will auto dismiss after a timout (3000ms).

// showBootstrapAlertSuccess(Message, contentType, dissmisable, timeout);
$('#el').showBootstrapAlertSuccess('Message here', Bootstrap.ContentType.Text, false, 3000);

6. Create a custom feedback message on the web page.

$('#el').showBootstrapAlert({
  message: "Message Here",
  alertType: { Background: 'alert background', Icon: Bootstrap.GlyphIcon.Link },
  contentType: Bootstrap.ContentType.Html,
  dissmisable: true,
  timeout: 6000
});

Change log:

2015-09-20

• Added support for FontAwesome class names.

2015-09-16

• fix pass contentType parameter

 

---

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