Tiny Popup Notification JavaScript Library – Notifast

Category: Javascript , Notification | December 22, 2021
Author:lightsyr
Views Total:144 views
Official Page:Go to website
Last Update:December 22, 2021
License:MIT

Preview:

Tiny Popup Notification JavaScript Library – Notifast

Description:

Notifications are a great way to keep your app users informed. If you want to create notifications with a tiny javascript library that is simple and easy-to-use, this Notifast library is for you!

Notifast is a lightweight and blazing-fast JavaScript library for creating and displaying custom notification popups at the top or bottom of the document. Let’s get started!

How to use it:

1. Load the Notifast’s JavaScript and Stylesheet in the document.

<link rel="stylesheet" href="notifast.min.css" />
<script src="notifast.min.js"></script>

2. Create a new notifast instance and determine the position of the notification popup. Default: ‘top-right’.

let myNotification = notifast({ 
    position: 'bottom-right' 
})

3. Create a basic notification.

myNotification.emitNotification({
  title: 'Notification Title',
  description: 'Notification Message',
})

4. Add a custom icon to the notification.

myNotification.emitNotification({
  title: 'Notification Title',
  description: 'Notification Message',
  icon: 'ANY ICON HTML HERE',
})

5. Set the text & background colors:

myNotification.emitNotification({
  title: 'Notification Title',
  description: 'Notification Message',
  backgroundColor: '#FFF',
  fontColor: '#0F73FA',
})

6. Determine whether to display a close button inside the notification.

myNotification.emitNotification({
  title: 'Notification Title',
  description: 'Notification Message',
  canBeClosed: true,
})

7. Attach a link to the notification.

myNotification.emitNotification({
  title: 'Notification Title',
  description: 'Notification Message',
  link: 'https://www.cssscript.com',
})

You Might Be Interested In:


Leave a Reply