Minimal Sliding Toast Plugin For jQuery - jToast.js

jToast.js is a really small (~1kb) and CSS-less jQuery toaster plugin which lets you create Android-style toast messages sliding out from the right side of the screen.

Licensed under the GNU Lesser General Public License v3.0.

See also:

• 15 Best Toast Notification jQuery Plugins

How to use it:

1. Place the minified version of the jToast.js library after jQuery.

<script src="https://code.jquery.com/jquery-3.3.1.min.js" 
        integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" 
        crossorigin="anonymous"></script>
<script src="jToast.min.js"></script>

2. Create a basic toast message that will auto dismiss after 3 seconds.

showToast('This is a toast.');

3. Define the radius of the toast's corner.

showToast('This is a toast.', {
  borderRadius: '5px'
});

4. Change the timeout to 5 seconds.

showToast('This is a toast.', {
  duration: 3000
});

5. Change the background & text colors.

showToast('This is a toast.', {
  background: '#232323',
  color: '#fff'
});

6. Hide the toast notification manually.

hideToast(toastID);

7. Show a close icon inside the toast notification. Default: false.

showToast('This is a toast.', {
  close: true
});

8. Show a progress bar that indicates the remaining time. Default: false.

showToast('This is a toast.', {
  progressBar: true
});

Changelog:

2019-04-22

• Added countdown bar

2019-04-21

• Added hideToast function

2019-04-20

• v1.0.3: syntax & doc updated

---

This awesome jQuery plugin is developed by l2ig. For more Advanced Usages, please check the demo page or visit the official website.