Minimal Toast Notification & Loading Indicator Plugin - Toast.js

Toast.js is a super simple, CSS-less jQuery plugin to create animated loading indicators and Android-inspired success/error toast notifications on the webpage.

How to use it:

1. Download and insert the jquery.toast.js script after the latest jQuery JavaScript library.

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

2. Create a default loading indicator on the screen that will auto dismiss after 1.5 seconds.

$.Toast.showToast();

3. Create a toast-like notification popup on the screen.

$.Toast.showToast({

  // toast message
  "title": "Toast Message...",

  // "success", "none", "error"
  "icon": "loading"
  
});

4. Add a custom image to the toast popup & loading indicator. This will override the default icon option.

$.Toast.showToast({

  // toast message
  "title": "Toast Message...",

  // path to your image
  "image": ""

});

5. Customize the duration in milliseconds.

$.Toast.showToast({

  // toast message
  "title": "Toast Message...",

  // default: 1500
  "duration": 3000

});

6. Hide the Toast Notification & Loading Indicator manually.

$.Toast.hideToast();

---

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