Android Style Toast Message Plugin For jQuery - ToastJS
File Size: | 10 KB |
---|---|
Views Total: | 1193 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
ToastJS is a lightweight (~3kb minified) jQuery based notification library used to display Google & Android style toast notifications that allow for queuing toast messages.
How to use it:
1. Include the needed jQuery JavaScript library and the toast.min.js
script on your webpage.
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="path/to/toast.min.js"></script>
2. Create a basic toast message using Toast.show()
method with default parameters.
Toast.show({ message : "This is a <b>Toast</b> message." });
3. Configuration options.
position : Toast.POSITION_BOTTOM, duration : Toast.DURATION_NORMAL, align : Toast.ALIGN_CENTER, class : Toast.DEFAULT_CLASS, background : '#000000', color : '#ffffff', opacity : '0.6', radius : '16', // border radius fontSize : '14px', appearTime : 0.3, // seconds message : '', top : '40px', left : '40px'
4. Configuration options.
DEFAULT_CLASS : 'toast-item', /* * Duration variables in milis */ DURATION_LONG : 4000, DURATION_NORMAL : 2000, DURATION_SHORT : 1000, /* * Position variables */ POSITION_TOP : 'top', POSITION_BOTTOM : 'bottom', POSITION_MIDDLE : 'middle', /* * Align variables */ ALIGN_CENTER : 'center', ALIGN_LEFT : 'left', ALIGN_RIGHT : 'right', /* * Queue variable for queuing toast messages */ QUEUE : new Array(), TIMEOUT : null, TIMEOUT_HIDE : null,
This awesome jQuery plugin is developed by tutcugil. For more Advanced Usages, please check the demo page or visit the official website.