Fully Configurable Toaster Plugin For jQuery - xl-toast
| File Size: | 7.34 KB |
|---|---|
| Views Total: | 1505 |
| 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.











