Fully Configurable Toaster Plugin For jQuery - xl-toast
File Size: | 7.34 KB |
---|---|
Views Total: | 1494 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
xl-toast is a super light (2kb unminified) jQuery plugin that helps you create highly customizable, Android style toast notifications using jQuery .extend()
method.
How to use it:
1. Include the JavaScript file xl-toast.js
after jQuery library and we're ready to go.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="js/xl-toast.js"></script>
2. The JavaScript to show a default toast message on the screen.
$.toast({ title: 'This is a toast message.' });
3. Set the position of your toast message.
$.toast({ title: 'This is a toast message.', position: 'top' // e.g. top, bottom, middle });
4. Override the default the timeout.
$.toast({ title: 'This is a toast message.', duration: 5000 });
5. Set the size (width/height) of the toast message.
$.toast({ title: 'This is a toast message.', width: 'auto', height: '20px', lineheight: 20px });
6. Set the text and background colors.
$.toast({ title: 'This is a toast message.', backgroundColor: 'rgba(0, 0, 0, .7)', textColor: '#fff' });
This awesome jQuery plugin is developed by lyw-fl. For more Advanced Usages, please check the demo page or visit the official website.