Create Simple Alert Messages with jQuery and Bootstrap - alert.js
File Size: | 4.94 KB |
---|---|
Views Total: | 76527 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

alert.js is a jQuery notification plugin which allows you to display one or multiple alert messages via Bootstrap alerts components.
Features:
- Auto close with countdown timers.
- 4 notification types based on Bootstrap.
- Can be positioned anywhere on your web page.
- Without any extra CSS.
Basic Usage:
1. Load Bootstrap's stylesheet in the head section of the web page.
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
2. Load jQuery library and the jQuery alert.js script at the end of the web page.
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script src="alert.js"></script>
3. Create an alert message box with minimal setup.
$.alert("Message here","Title here");
4. Or bind the plugin to a button so you can trigger the alert message box manually.
$('button').on('click', function () { $.alert('Message here', { // Options }); });
5. All the options.
// Enable auto close autoClose: true, // Auto close delay time in ms (>1000) closeTime: 5000, // Display a countdown timer withTime: false, // danger, success, warning or info type: 'danger', // position+offeset // top-left,top-right,bottom-left,bottom-right,center position: ['center', [-0.42, 0]], // Message title title: false, // For close button close: '', // Animation speed speed: 'normal', // Set to false to display multiple messages at a time isOnly: true, // Minimal space in PX from top minTop: 10, // onShow callback onShow: function () { }, // onClose callback onClose: function () { }
This awesome jQuery plugin is developed by gkShine. For more Advanced Usages, please check the demo page or visit the official website.