A very simple lightweight responsive javascript library to make custom confirm()
and alert()
acModal is very easy to use here is a basic example for an alert modal:
Run this command in your project
npm install --save-dev ac-modal
And then:
const acModal = require('ac-modal');
Or you can add it with a script tag, download the file build/index.js
and then:
<script src="https://yourwebsite.com/path/to/index.js"></script>
//on element click show an alert modal
document.getElementById('button').addEventListener('click', function () {
acModal.alert({
message: 'This is an alert page', //the message to display
buttonCallBack: function () { //the function on the click of the OK button
console.log('You have clicked on OK');
},
});
});
Name | type | required |
---|---|---|
title |
string |
false |
message |
string |
true |
buttonCallBack |
function |
false |
buttonText |
string |
false default: OK |
appendTo |
string |
false (query selector) |
//on element click show a confirm modal
document.getElementById('button').addEventListener('click', function () {
acModal.confirm({
title: 'Hi I am a title',
message: 'Do you want to add some lorem ispum in page?',
successCallBack: function () {
console.log('You have clicked on the success button');
},
cancelCallBack: function () {
console.log('You have clicked on the cancel button');
},
});
});
Name | type | required |
---|---|---|
title |
string |
false |
message |
string |
true |
successCallBack |
function |
false |
successText |
string |
false default: OK |
cancelCallBack |
function |
false |
cancelText |
string |
false default: Cancel |
appendTo |
string |
false (query selector) |
After you've clone the repository first run:
npm install
Then to run webpack:
npm run dev