jQuery Plugin For Sliding Message Bar with Boostrap Alerts Component - Bootstrap Msg
File Size: | 713 KB |
---|---|
Views Total: | 7933 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Bootstrap Msg is a jQuery plugin that uses Bootstrap's alerts component to display alert messages in a sliding message bar at the top of the page. Currently supports 4 types of message provided by Bootstrap: 'success', 'info', 'warning' and 'danger'.
Basic Usage:
1. Include the jQuery javascript library and jQuery Boostrap Msg plugin in the Html document.
<link rel="stylesheet" type="text/css" href="bootstrap-msg.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="bootstrap-msg.js"></script>
2. Include the required Twitter Boostrap 3 in the document.
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
3. Include the Font Awesome if you wish to use FontAwesome icons instead of Bootstrap icons.
<link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" />
4. Show message.
Msg.show(message, type, timeout);
- message: The message content
- type: The type of message. Can be `success`, `info`, `warning` and `danger`.
- timeout: The duration of message. Default is 3000 (ms)
5. Show specified type message.
Msg.success(message, timeout); Msg.info(message, timeout); Msg.warning(message, timeout); Msg.error(message, timeout); Msg.danger(message, timeout);
Change log:
2014-05-14
- Default timeout for each of message type
v0.2 (2014-05-07)
- update.
This awesome jQuery plugin is developed by bobkhin. For more Advanced Usages, please check the demo page or visit the official website.