x
Всем привет . Подскажите, имеется код для одной галереи работает отлично, но когда надо для двух на одной странице вторая галерея не хочет работать. Как такой код адаптировать под несколько галерей на одной странице. <script>
document.addEventListener("DOMContentLoaded", function () {
const galleryList = document.querySelector('._customer-gallery'),
galleryImage = document.querySelectorAll('._customer-gallery__preview'),
galleryPopUp = document.getElementById('_customer-gallery__pop-up'),
galleryPopUpPrev = galleryPopUp.querySelector('._customer-pop-up__button_prev'),
galleryPopUpNext = galleryPopUp.querySelector('._customer-pop-up__button_next'),
galleryPopUpContent = galleryPopUp.querySelector('._customer-pop-up__content');
let galleryImageCurrent = 0;
function showImage() {
galleryPopUpContent.innerHTML = galleryImage[galleryImageCurrent].innerHTML;
}
galleryList.onclick = function (e) {
let array = [];
for (let i = 0; i < galleryImage.length; i++) {
array.push(galleryImage[i]);
}
if (e.target.classList.contains('_customer-gallery__preview')) {
galleryImageCurrent = array.indexOf(e.target);
showImage();
popOpen('_customer-gallery__pop-up');
}
}
galleryPopUpPrev.addEventListener('click', function () {
if (galleryImageCurrent == 0) {
galleryImageCurrent = galleryImage.length - 1;
} else {
galleryImageCurrent = (galleryImageCurrent - 1) % galleryImage.length;
}
showImage();
});
galleryPopUpNext.addEventListener('click', function () {
galleryImageCurrent = (galleryImageCurrent + 1) % galleryImage.length;
showImage();
});
});
</script>
