29 lines
1.4 KiB
JavaScript
29 lines
1.4 KiB
JavaScript
|
|
let triggers = document.querySelectorAll("[data-toggle='modal']");
|
|
triggers.forEach(trigger => {
|
|
let modal = document.querySelector(trigger.getAttribute("data-target"));
|
|
trigger.addEventListener("click", function () {
|
|
console.log(modal.getAttribute("aria-hidden"));
|
|
if(modal.getAttribute("aria-hidden") == "true"){
|
|
modal.setAttribute("aria-hidden", "false")
|
|
let modal_backdrop = document.createElement("div")
|
|
modal_backdrop.classList.add("opacity-0", "z-990", "fixed", "bg-black", "top-0", "left-0", "w-screen", "h-screen", "transition-opacity", "ease-linear");
|
|
modal_backdrop.setAttribute("modal-backdrop", trigger.getAttribute("data-target"));
|
|
document.body.appendChild(modal_backdrop);
|
|
modal_backdrop.classList.add("opacity-50");
|
|
modal_backdrop.classList.remove("opacity-0");
|
|
} else {
|
|
modal.setAttribute("aria-hidden", "true")
|
|
let backdrop = document.querySelector("[modal-backdrop='"+ trigger.getAttribute("data-target") +"']")
|
|
backdrop.remove();
|
|
}
|
|
modal.classList.toggle("hidden");
|
|
modal.classList.toggle("opacity-0");
|
|
modal.classList.toggle("block");
|
|
|
|
modal.firstElementChild.classList.toggle("-translate-y-13");
|
|
modal.firstElementChild.classList.toggle("transform-none");
|
|
});
|
|
|
|
});
|