Toast-like Alert Popup Plugin With jQuery and Bootstrap - bootstrapAlert

File Size: 5.84 KB
Views Total: 3804
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Toast-like Alert Popup Plugin With jQuery and Bootstrap - bootstrapAlert

bootstrapAlert is an easy to use jQuery plugin which helps you create Android toast-syle info/warning/success/danger alert popups using Bootstrap styles.

How to use it:

1. This plugin requires Bootstrap's stylesheet loaded in the document's head section.

<link rel="stylesheet" href="bootstrap.min.css">

2. Load jQuery library and the bootstrapAlert plugin at the end of the document.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="bootstrapAlert.js"></script>

3. Here's a list of methods to create various types of alert popups.

BootstrapAlert.info({
  title: "Info!",
  message: "This is An info alert"
});

BootstrapAlert.warning({
  title: "Warning!",
  message: "This is a warning alert"
});

BootstrapAlert.success({
  title: "Success!",
  message: "This is a success alert"
});

BootstrapAlert.alert({
  title: "Danger!",
  message: "This is a danger alert"
});

4. By default, the alert popups will auto dismiss after 3 seconds. You can override the default timeout in the JavaScript like this:

BootstrapAlert.alert({
  title: "Danger!",
  message: "This is a danger alert",
  hideTimeout: 3000,
});

5. More configuration options with default values.

BootstrapAlert.alert({
  title: "Danger!",
  message: "This is a danger alert",
  hideTimeout: 3000,
  autoHide: true,
  dissmissible: false,
  parentClass: 'bootstrap-alert',
  innerClass: 'bootstrap-alert-message',
});

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