Tiny Growl-style Notification Plugin For jQuery - Alertigo
| File Size: | 4.87 KB |
|---|---|
| Views Total: | 1557 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Alertigo is a very small (~2kb unminified) and cross-browser jQuery plugin to display stacked, sticky (or auto-dismissable), and growl style alert messages at the bottom of the screen.
How to use it:
1. Make sure jQuery library is included in the document, then include the jquery-alertigo.css and jquery-alertigo.js in the web page.
<link href="jquery-alertigo.css" rel="stylesheet"> <script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery-alertigo.js"></script>
2. Create a placeholder element for the alert notifications.
<div id="alertigo"></div>
3. The JavaScript to display a default alert notification on the screen.
$(document).ready(function(){
alertigo('This is a default alertigo.js notification message!');
});
4. To change the default theme of the alert notification, just override the default value of the color option as this:
$(document).ready(function(){
alertigo('This is a GREEN alertigo.js notification message!', {
color: 'green'
});
alertigo('This is a LIGHT-BLUE alertigo.js notification message!', {
color: 'light-blue'
});
alertigo('This is a ORANGE alertigo.js notification message!', {
color: 'orange'
});
alertigo('This is a RED alertigo.js notification message!', {
color: 'red'
});
});
5. By default, the alert notification will auto dismisses after 3 seconds. To change the default timeout follow this step:
$(document).ready(function(){
alertigo('Auto dismiss after 1000ms', {
life: '1000'
});
});
6. You can also create a sticky notification message that always stays on the screen until you click it.
$(document).ready(function(){
alertigo('This is a STICKY alertigo.js notification message!',{
sticky: true
});
});
This awesome jQuery plugin is developed by TetrisSmalls. For more Advanced Usages, please check the demo page or visit the official website.











