Lightweight And Practical Alert Popup Library – Prompt.js

Category: Javascript , Notification | January 26, 2021
Author: SolomonLeon
Views Total: 202 views
Official Page: Go to website
Last Update: January 26, 2021
License: MIT

Preview:

Lightweight And Practical Alert Popup Library – Prompt.js

Description:

Prompt.js is a lightweight, configurable JavaScript notification library to create beautiful, cross-platform, toast-like alert popups using plain JavaScript.

How to use it:

1. Insert the Prompt.js and Prompt.css into the HTML page.

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

2. Create a new instance of the Prompt.js and we’re ready to go.

var p = loadPrompt();

3. Create basic alert popups with pre-built types. Note that these alert popups will auto dismiss after 2 seconds.

p.success('Success Message');
p.warn('Warning Message');
p.error('Error Message');
p.inform('Information Message');

4. Create a Sticky alert popup that will always be visible until it is clicked/tapped.

var sticky = p.inform('Click Me To Remove', true);
sticky.click(function(){
  m.remove() // remove
})

5. Switch between notification types and update alert message programmatically.

var advanced = p.error('Switch After 2 Seconds',true);
setTimeout(function(){
    advanced.switch('success');
    advanced.modify('Done!')
    setTimeout(function(){
      advanced.remove()
    },2000)
},2000)

6. Clear all activated alert popups.

p.clean()

7. Config the alert popup.

p.config{
  classList: {}
  displayTime: 1690
  errorModel: DOM
  informModel: DOM
  shake: true
  successModel: DOM
  warnModel: DOM
}

You Might Be Interested In:


Leave a Reply