Small Toast-like Notification Popup Library – notify-native.js

Preview:

Description:

notify-native.js is a tiny library for creating toast-like notification popups with or without sound using native JavaScript.

How to use it:

1. Load the main stylesheet and notify-native.js library in the document.

<link rel="stylesheet" href="style/css/main.min.css" />
<script src="assets/script/notify.js"></script>

2. Initialize the notify-native.js.

const notify = new Notify();

3. Create an info toast notification.

notify.render({
  head: "Info",
  content: "A simple info alert—check it out!"
});

4. Additional themes:

• Danger
• Success
• Warning

notify.render({
  head: "Danger",
  content: "A simple danger alert—check it out!"
  style: "danger",
});

5. Determine whether to play a sound when the notification is activated. Default: false.

notify.render({
  head: "Info",
  content: "A simple info alert—check it out!",
  sound: true,
});

6. Change the position of the notification: “top_left” or “bottom_right” (default: top_right).

notify.render({
  head: "Info",
  content: "A simple info alert—check it out!",
  corner: "top_right",
});

7. Set the delay in milliseconds. By default, the notification automatically dismisses itself after 5 seconds.

notify.render({
  head: "Info",
  content: "A simple info alert—check it out!",
  delay: 5000
});

8. Set the maximum number of notifications on the screen. Default: 10.

notify.render({
  head: "Info",
  content: "A simple info alert—check it out!",
  maxElem: 5
});