Minimal Cross-platform jQuery Toaster Plugin - ztoast
| File Size: | 9.08 KB |
|---|---|
| Views Total: | 791 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
ztoast is a really simple and small jQuery plugin used to display 'Toast' style notification messages at the bottom right of the webpage.
Features:
- Fade in/out animations.
- Auto close after 5 seconds.
- Click/tap on the notifications to close manually.
How to use it:
1. Just include the main JavaScript file ztoast.min.js after jQuery library and you're ready to go.
<script src="//code.jquery.com/jquery-3.1.1.min.js"></script> <script src="build/ztoast.min.js"></script>
2. The JavaScript to show a toast message that will auto dismiss after 5 seconds.
$.toast('Hello World!')
3. Specify the duration in milliseconds.
// 3 seconds
$.toast('Hello World!',3000)
4. Override the default CSS styles of the toast notifications.
#ztoast-container {
width: 322px;
position: fixed;
right: 10px;
...
}
5. Default plugin arguments.
var containerId = 'ztoast-container'; var styleId = 'ztoast-stylesheet'; var contentClass = 'ztoast-content'; var fadeTime = 500; var defaultDuration = 2000; var onClickClose = true;
Change log:
2016-12-10
- fix container z-index
This awesome jQuery plugin is developed by lenonmauer. For more Advanced Usages, please check the demo page or visit the official website.











