Customizable Alert Box In JavaScript – Pling.js

Category: Modal & Popup | December 11, 2020
Author: stonny71
Views Total: 276 views
Official Page: Go to website
Last Update: December 11, 2020
License: MIT

Preview:

Customizable Alert Box In JavaScript – Pling.js

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;
}

You Might Be Interested In:


Leave a Reply