Auto Dismiss Bootstrap Alert Plugin With jQuery
File Size: | 5.05 KB |
---|---|
Views Total: | 14158 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A minimalist jQuery plugin to enhance the default Bootstrap alert component that allows to automatically dismiss alert messages after a specific timeout.
How to use it:
1. Insert the JavaScript file bootstrap-auto-dismiss-alert.js
into your Bootstrap project.
<script src="jquery.min.js"></script> <script src="bootstrap.min.js"></script> <script src="bootstrap-auto-dismiss-alert.js"></script>
2. Add the data-auto-dismiss
attribute to the target alert message that will auto close after 5 seconds (5000ms).
<div class="alert alert-warning alert-dismissible fade in" data-auto-dismiss role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span></button> <strong>Warning!</strong> Warning message here </div>
3. Override the default timeout in milliseconds as this:
<div class="alert alert-success" role="alert" data-auto-dismiss="2000"> simple success example </div>
This awesome jQuery plugin is developed by mariomka. For more Advanced Usages, please check the demo page or visit the official website.