Slight refactor of JS file
This commit is contained in:
parent
011fa22e29
commit
b57df70d56
16
js/script.js
16
js/script.js
|
@ -1,6 +1,4 @@
|
|||
let icon = document.querySelectorAll(".clickable-image");
|
||||
|
||||
let descriptions = {
|
||||
const descriptions = {
|
||||
"baxter-stare.png": "Baxter lovingly staring at the camera on a sunny day in the apartment. One of my favorite photos of him. He would have been 6 or 7 around this time.",
|
||||
"baxter-box.png": "Baxter loves his boxes, and can often be found relaxing or sleeping in one. We had quite a few at one point!",
|
||||
"baxter-flop.png": "Baxter shows ultimate comfiness by flopping upside down. A sign that he is very happy and very cozy.",
|
||||
|
@ -11,8 +9,10 @@ let descriptions = {
|
|||
"baxter-wall.png": "In the apartment he often liked to stretch against this wall. I think he liked the sunlight on his stomach. Typical cat!",
|
||||
};
|
||||
|
||||
icon.forEach((item) => {
|
||||
item.addEventListener("click", () => {
|
||||
let icons = document.querySelectorAll(".clickable-image");
|
||||
|
||||
icons.forEach((icon) => {
|
||||
icon.addEventListener("click", () => {
|
||||
|
||||
let desktop = document.querySelector("body");
|
||||
|
||||
|
@ -32,7 +32,7 @@ icon.forEach((item) => {
|
|||
|
||||
let windowTilte = document.createElement("h2");
|
||||
windowTilte.classList.add("title");
|
||||
windowTilte.textContent = item.querySelector("figcaption").textContent;
|
||||
windowTilte.textContent = icon.querySelector("figcaption").textContent;
|
||||
titleBar.appendChild(windowTilte);
|
||||
|
||||
let separator = document.createElement("div");
|
||||
|
@ -48,7 +48,7 @@ icon.forEach((item) => {
|
|||
|
||||
let figure = document.createElement("figure");
|
||||
let image = document.createElement("img");
|
||||
image.src = `img/${item.querySelector("figcaption").textContent}`;
|
||||
image.src = `img/${icon.querySelector("figcaption").textContent}`;
|
||||
image.style.height = "500px";
|
||||
image.style.width = "auto";
|
||||
figure.style.marginTop = "0.75rem";
|
||||
|
@ -58,7 +58,7 @@ icon.forEach((item) => {
|
|||
figure.appendChild(image);
|
||||
|
||||
let figureCaption = document.createElement("figcaption");
|
||||
figureCaption.textContent = `${descriptions[item.querySelector("figcaption").textContent]}`;
|
||||
figureCaption.textContent = `${descriptions[icon.querySelector("figcaption").textContent]}`;
|
||||
figureCaption.style.textAlign = "center";
|
||||
figureCaption.style.marginTop = "1rem";
|
||||
figure.appendChild(figureCaption);
|
||||
|
|
Loading…
Reference in New Issue