23 lines
675 B
JavaScript

const dialog = document.querySelector("dialog");
const closeDialog = (e) => {
e.stopPropagation();
console.log("close")
dialog.close();
document.body.removeEventListener("click", closeDialog);
}
const showLightbox = (e) => {
e.preventDefault();
e.stopPropagation();
const img = dialog.querySelector("img");
img.src = e.currentTarget.src;
img.alt = e.currentTarget.alt;
dialog.querySelector("p").textContent = e.currentTarget.alt;
dialog.showModal();
document.body.addEventListener("click", closeDialog, false);
}
document.querySelectorAll("article img").forEach((img) => {
img.addEventListener("click", showLightbox);
})