Customizable Alert Box In JavaScript – Pling.js

Preview:

Description:

A tiny Vanilla JavaScript JavaScript library for displaying custom alert boxes or modal popups on the page.

Easy to use and fully styleable using your own CSS.

How to use it:

1. Download the zip and insert the JavaScript pling.js in the document.

<script src="pling.js"></script>

2. Display a basic alert box on the page.

Pling("CSSScript.com");

3. Add a custom title to the alert box.

Pling("CSSScript.com", "Title Here");

4. Append a custom CSS class to the alert box and then you can apply your own styles.

Pling("CSSScript.com", "Title Here", "customClass");

/**main container**/
.custom .box{
  background:#333 !important;
  color:#fff !important;
}
/**title of the alert**/
.custom .title {
  background:#64B5F6 ! important;
  color:#fff !important;
}
/**content of the alert**/
.custom .content {
  color:#fff !important;
}
/**ok button**/
.custom .btn {
  background:#333 !important;
  color:#fff !important;
}