diff options
Diffstat (limited to 'content')
-rw-r--r-- | content/lightbox.js | 14 |
1 files changed, 8 insertions, 6 deletions
diff --git a/content/lightbox.js b/content/lightbox.js index e672d63..deb5cce 100644 --- a/content/lightbox.js +++ b/content/lightbox.js | |||
@@ -1,12 +1,14 @@ | |||
1 | (() => { | 1 | (() => { |
2 | const mainEl = document.querySelector("main"); | 2 | const mainEl = document.querySelector("main"); |
3 | const lightboxContainerEl = document.querySelector(".js-lightbox"); | 3 | const lightboxContainerEl = document.querySelector(".js-lightbox"); |
4 | const lightboxEl = lightboxContainerEl.querySelector(".o-lightbox"); | 4 | const lightboxEl = lightboxContainerEl.classList.contains("o-lightbox") |
5 | ? lightboxContainerEl | ||
6 | : lightboxContainerEl.querySelector(".o-lightbox"); | ||
5 | const lightboxCloseEl = lightboxEl.querySelector(".o-lightbox__close-btn"); | 7 | const lightboxCloseEl = lightboxEl.querySelector(".o-lightbox__close-btn"); |
6 | const lightboxPrevEl = lightboxEl.querySelector(".o-lightbox__prev-btn"); | 8 | const lightboxPrevEl = lightboxEl.querySelector(".o-lightbox__nav-btn--prev"); |
7 | const lightboxNextEl = lightboxEl.querySelector(".o-lightbox__next-btn"); | 9 | const lightboxNextEl = lightboxEl.querySelector(".o-lightbox__nav-btn--next"); |
8 | const lightboxImgEl = lightboxEl.querySelector(".o-lightbox__img"); | 10 | const lightboxImgEl = lightboxEl.querySelector(".o-lightbox__img"); |
9 | const lightboxFooterEl = lightboxEl.querySelector(".o-lightbox__footer"); | 11 | const lightboxThumbnailsEl = lightboxEl.querySelector(".o-lightbox__thumbnails"); |
10 | const figureEls = Array.from(mainEl.querySelectorAll(".js-lightbox__image")); | 12 | const figureEls = Array.from(mainEl.querySelectorAll(".js-lightbox__image")); |
11 | 13 | ||
12 | const standalone = lightboxContainerEl.classList.contains("js-lightbox--standalone"); | 14 | const standalone = lightboxContainerEl.classList.contains("js-lightbox--standalone"); |
@@ -72,7 +74,7 @@ | |||
72 | thumbnailButtonEl.appendChild(thumbnailImgEl); | 74 | thumbnailButtonEl.appendChild(thumbnailImgEl); |
73 | thumbnailButtonEl.addEventListener("click", go); | 75 | thumbnailButtonEl.addEventListener("click", go); |
74 | 76 | ||
75 | lightboxFooterEl.appendChild(thumbnailButtonEl); | 77 | lightboxThumbnailsEl.appendChild(thumbnailButtonEl); |
76 | 78 | ||
77 | if (!standalone) { | 79 | if (!standalone) { |
78 | figureEl.firstElementChild.addEventListener("click", go); | 80 | figureEl.firstElementChild.addEventListener("click", go); |
@@ -89,7 +91,7 @@ | |||
89 | if (figureEls.length <= 1) { | 91 | if (figureEls.length <= 1) { |
90 | lightboxPrevEl.remove(); | 92 | lightboxPrevEl.remove(); |
91 | lightboxNextEl.remove(); | 93 | lightboxNextEl.remove(); |
92 | lightboxFooterEl.remove(); | 94 | lightboxThumbnailsEl.remove(); |
93 | } | 95 | } |
94 | 96 | ||
95 | if (!standalone) { | 97 | if (!standalone) { |