Minimal Fading Toast Message Plugin For jQuery - iToast
File Size: | 3.04 KB |
---|---|
Views Total: | 588 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
iToast is a dead simple jQuery notification plugin which helps you display minimal, clean, Android-style, auto-dismiss toast messages at the bottom of the screen.
How to use it:
1. Load the stylesheet itoast.css
that provides the basic styling of the toast messages.
<link href="itoast.css" rel="stylesheet">
2. Load both jQuery library and the jQuery itoast.js script when needed.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="itoast.js"></script>
3. The JavaScript to show a basic toast message on the screen. Possible parameters:
- msg: Toast message here.
- tm: Timeout in milliseconds.
- theme: Theme name. Built in themes: theme_red and theme_green.
// itoast.show(msg,tm,theme) itoast.show("Toast message!",5000,'theme_green');
4. Override the default styles:
.theme_red { border: 2px solid #da6262; background-color: #cd6c6c; color: #FFF; } .theme_green { border: 2px solid #D6E9C6; background-color: #DFF0D8; color: #468847; }
5. You can create your own themes in the CSS as follow:
.theme_NAME { ... }
This awesome jQuery plugin is developed by shankpaul. For more Advanced Usages, please check the demo page or visit the official website.