Toast-style Notification Box jQuery Plugin - Toastee
| File Size: | 5.92 KB |
|---|---|
| Views Total: | 855 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Toastee is a lightweight yet customizable notification jQuery plugin for creating toast-like notification boxes that automatically fade out after a specific timeout.
How to use it:
1. To begin with, load the jquery.toastee.js script after jQuery library.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/jquery.toastee.0.1.js"></script>
2. Call the function on the container in which the toast messages will appear.
<div id="testy"></div>
$('#testy').toastee({
header: 'Toast Title',
message: 'Toast Message'
});
3. Specify the notification type.
- info (default)
- error
- success
$('#testy').toastee({
header: 'Toast Title',
message: 'Toast Message',
type: 'error',
});
4. Customize the background & text colors of the toast messages.
$('#testy').toastee({
header: 'Toast Title',
message: 'Toast Message',
color: '#fff',
background: '#3498db',
});
5. Set the width of the toast messages. Default: 200(px).
$('#testy').toastee({
header: 'Toast Title',
message: 'Toast Message',
width: 300,
});
6. Override the default timeout.
$('#testy').toastee({
header: 'Toast Title',
message: 'Toast Message',
fadeout: 5000, // auto dismiss after 5 seconds
});
This awesome jQuery plugin is developed by ericgrogers. For more Advanced Usages, please check the demo page or visit the official website.











