https://github.com/maikenegreiros/modal-boxes
A simple JS script to open and close Modal Boxes. It's useful to menu bars as well
https://github.com/maikenegreiros/modal-boxes
modal-box modal-dialog modal-dialogs modalbox modals
Last synced: 4 months ago
JSON representation
A simple JS script to open and close Modal Boxes. It's useful to menu bars as well
- Host: GitHub
- URL: https://github.com/maikenegreiros/modal-boxes
- Owner: maikenegreiros
- Created: 2018-10-08T13:40:51.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2018-11-06T13:58:41.000Z (over 6 years ago)
- Last Synced: 2025-01-13T15:49:17.116Z (5 months ago)
- Topics: modal-box, modal-dialog, modal-dialogs, modalbox, modals
- Language: JavaScript
- Size: 89.8 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# Modal Boxes
If your modal box is both opened and closed by the same button, you can do like the example below
```js
import ModalBoxes from 'modal-boxes'
const menu = document.querySelector('.menu')
const btMenu = document.querySelector('.bt-menu')
ModalBoxes(menu, btMenu)
```
Instead, if your modal box have one button to open and another to close, you must do like that
```js
import ModalBoxes from 'modal-boxes'
const menu = document.querySelector('.menu')
const buttonOpenMenu = document.querySelector('.bt-menu')
const buttonCloseMenu = document.querySelector('.bt-close-menu')
const options = {
buttonClose: buttonCloseMenu
}
ModalBoxes(menu, btMenu, option)
```
if you want to assign some custom css class to the button or the modal box, you can do as follows
```js
import ModalBoxes from 'modal-boxes'
const menu = document.querySelector('.menu')
const btMenu = document.querySelector('.bt-menu')
const options = {
menuActiveClass: "my-css-class",
menuInactiveClass: "my-other-css-class",
buttonActiveClass: "another-css-class",
buttonInactiveClass: "again-another-css-class"
}
ModalBoxes(menu, btMenu, options)
```