Tiny Toast Notification Library For jQuery - Toast.js
File Size: | 2.82 KB |
---|---|
Views Total: | 2366 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Toast.js is a small, simple, CSS-less, cross-browser jQuery toast notification plugin that you can determine how long the toast message stays on the screen.
Supports both plain Text and HTML content inside the toast notification.
How to use it:
1. Put the main JavaScript file 'Toast.js' after jQuery.
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"> </script> <script src='./js/toast.js'></script>
2. The JavaScript to show a custom toast message on the screen.
$.toast({ // toast message here title: 'I am a TOAST notification' });
3. By default the toast notification will auto dismiss after 5 seconds. You can override the default timeout in the JavaScript:
$.toast({ duration: 5000 });
4. Set the position of the toast notification: Top, Middle or Bottom.
$.toast({ position: 'bottom' // default: 'middle' });
5. Customize the appearance of the toast notification.
$.toast({ // width width: 'auto', // height height: '28px', // background color backgroundColor: 'blue', // text color textColor: 'white', // line height lineheight: '1.6' });
This awesome jQuery plugin is developed by b-withers. For more Advanced Usages, please check the demo page or visit the official website.