-
Notifications
You must be signed in to change notification settings - Fork 0
/
abramovic.js
34 lines (28 loc) · 890 Bytes
/
abramovic.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
"use strict";
// selecting DOM elements
const modal = document.querySelector(".modal");
const previews = document.querySelectorAll(".img-container img");
const original = document.querySelector(".modal-img");
const caption = document.querySelector(".caption");
// open
previews.forEach((preview) => {
// event listener
preview.addEventListener("click", () => {
modal.classList.add("open");
// animation
original.classList.add("original");
// dyanmical change of img & txt
const originalSrc = preview.getAttribute("data-original");
// original.src = `${originalSrc}`;
original.src = originalSrc;
const altText = preview.alt;
caption.textContent = altText;
});
});
// close
modal.addEventListener("click", (e) => {
if (e.target.classList.contains("modal")) {
modal.classList.remove("open");
original.classList.remove("open");
}
});