Skip to content

Latest commit

 

History

History
76 lines (55 loc) · 1.97 KB

README.md

File metadata and controls

76 lines (55 loc) · 1.97 KB

Popup Alert

A Simple and Customizable JavaScript Code for Your Web Page https://www.npmjs.com/package/popup-alert

Installation

To begin using Popup Alert, you first need to install the package from npm. Simply run the following command:

npm i popup-alert

Next, you need to link the CSS and JS files to your project. Use the following code:

<link rel="stylesheet" href="/node_modules/popup-alert/app.css" />
<script src="/node_modules/popup-alert/index.js"></script>

Code Explanation

Popup Alert works by creating an object of the Alert class in JavaScript. You can use the following code to create an alert:

const alert = new Alert({
  text: "this is test text",
});

To display the alert, use the "show()" method:

alert.show();

Customizing

Popup Alert offers several parameters for customization. You can use the following code to customize the alert box:

const alert = new Alert({
  text: "this is text",
  textColor: "#fff",
  bgColor: "#474e68",
  buttonText: "OK",
  buttonTextColor: "#fff",
  buttonBgColor: "#007bff",
});

The available parameters are:

Parameter Type Description
text string title of alert
textColor string color of title
bgColor string alert box background color
buttonText string text of alert button
buttonTextColor string button text color
buttonBgColor string button background color

If you want the alert box to automatically hide after a certain amount of time, use the following code:

alert.show({
  enabled: true,
  time: 1000,
});

The "enabled" parameter is used to enable or disable the timer, and the "time" parameter is used to set the time in milliseconds before the alert box automatically hides.