ГАЛЕРЕЯ
Curated Collection
Visual Stories
Каждый кадр — отдельная вселенная. Нажмите для полноэкранного просмотра.
← → навигация · Esc закрыть
01 — 20
' + p.title + '
' +
'';
el.addEventListener("click", function () { open(i); });
grid.appendChild(el);
});
function open(i) {
idx = i;
sync();
lb.classList.add("hp-gallery__lb--open");
document.body.style.overflow = "hidden";
}
function close() {
lb.classList.remove("hp-gallery__lb--open");
document.body.style.overflow = "";
}
function sync() {
lbImg.src = photos[idx].src;
lbTitle.textContent = photos[idx].title;
curEl.textContent = String(idx + 1).padStart(2, "0");
}
function go(dir) {
idx = (idx + dir + photos.length) % photos.length;
lbImg.style.transition = "opacity 0.25s ease, transform 0.25s ease";
lbImg.style.opacity = "0";
lbImg.style.transform = "scale(0.96)";
setTimeout(function () {
sync();
lbImg.style.opacity = "1";
lbImg.style.transform = "scale(1)";
}, 220);
}
document.getElementById("hp-g-close").addEventListener("click", close);
document.getElementById("hp-g-prev").addEventListener("click", function () { go(-1); });
document.getElementById("hp-g-next").addEventListener("click", function () { go(1); });
lb.addEventListener("click", function (e) { if (e.target === lb) close(); });
document.addEventListener("keydown", function (e) {
if (!lb.classList.contains("hp-gallery__lb--open")) return;
if (e.key === "Escape") close();
if (e.key === "ArrowLeft") go(-1);
if (e.key === "ArrowRight") go(1);
});
})();