Toast Notifications With Auto Redirection Support - jQuery Notifications

File Size: 4.9 KB
Views Total: 2379
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Toast Notifications With Auto Redirection Support - jQuery Notifications

A tiny yet customizable toast notification jQuery plugin that allows to automatically redirect the current page to another URL when the countdown ends.

How to use it:

1. Insert the main script notifications.js after jQuery.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/notifications.js"></script>

2. Initialize the plugin and specify the toast message(s) in a JS array as follows:

// Single Toast Notification
$.notification(
  ["This is a toast message"],
  {
    // options here
  }
)

// Multiple Toast Notifications
$.notification(
  ["Toast Message 1", "Toast Message 2"],
  {
    // options here
  }
)

3. Set the position of the toast notification.

$.notification(
  ["This is a toast message"],
  {
    position: ['top', 'right'],
  }
)

4. Specify the timeout in milliseconds, which means that the toast messages will auto dismiss after this timeout. Default: 4000.

$.notification(
  ["This is a toast message"],
  {
    timeView: 5000,
  }
)

5. Specify the notification type:

  • success
  • warning
  • error
$.notification(
  ["This is a toast message"],
  {
    messageType: 'success',
  }
)

6. Determine whether to auto-redirect the current page when the toast message is dismissed.

$.notification(
  ["This is a toast message"],
  {
    redirectAction: 'https://www.jqueryscript.net'
  }
)

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