32 lines
1.3 KiB
JavaScript
32 lines
1.3 KiB
JavaScript
document.addEventListener("DOMContentLoaded", () => {
|
|
const prevButtons = document.querySelectorAll("button.prev");
|
|
const nextButtons = document.querySelectorAll("button.next");
|
|
|
|
nextButtons.forEach((nextButton) => {
|
|
nextButton.addEventListener("click", () => {
|
|
const activePicture = nextButton.closest(".project-slideshow").querySelector("picture.active");
|
|
const targetPicture =
|
|
activePicture.nextElementSibling &&
|
|
activePicture.nextElementSibling.tagName === "PICTURE"
|
|
? activePicture.nextElementSibling
|
|
: nextButton.closest(".project-slideshow").querySelector("picture");
|
|
activePicture.classList.remove("active");
|
|
targetPicture.classList.add("active");
|
|
});
|
|
});
|
|
|
|
prevButtons.forEach((prevButton) => {
|
|
prevButton.addEventListener("click", () => {
|
|
const slideshow = prevButton.closest(".project-slideshow");
|
|
const activePicture = slideshow.querySelector("picture.active");
|
|
const pictures = [...slideshow.querySelectorAll("picture")];
|
|
const targetPicture =
|
|
activePicture.previousElementSibling &&
|
|
activePicture.previousElementSibling.tagName === "PICTURE"
|
|
? activePicture.previousElementSibling
|
|
: pictures[pictures.length - 1];
|
|
activePicture.classList.remove("active");
|
|
targetPicture.classList.add("active");
|
|
});
|
|
});
|
|
});
|