Get your magic log in link

document.addEventListener('DOMContentLoaded', () => { const grid = document.querySelector('#custom-slider'); if(grid) { const prevBtn = document.querySelector('.custom-left'); const nextBtn = document.querySelector('.custom-right'); const itemsPerView = 2; const items = grid.querySelectorAll('.grid-item'); const itemWidth = 460; let currentPosition = 0; const maxPosition = Math.ceil(items.length / 2) - 1; let autoplayInterval; grid.style.transition = 'transform 0.5s ease-in-out'; function updateSliderPosition(smooth = true) { if (!smooth) { grid.style.transition = 'none'; } const offset = currentPosition * itemWidth; grid.style.transform = `translateX(-${offset}px)`; if (!smooth) { // Форсируем перерисовку grid.offsetHeight; grid.style.transition = 'transform 0.5s ease-in-out'; } prevBtn.disabled = currentPosition === 0; nextBtn.disabled = currentPosition >= maxPosition; } function startAutoplay() { autoplayInterval = setInterval(() => { if (currentPosition >= maxPosition) { currentPosition = 0; updateSliderPosition(); } else { currentPosition++; updateSliderPosition(); } }, 5000); } function stopAutoplay() { clearInterval(autoplayInterval); } prevBtn.addEventListener('click', () => { stopAutoplay(); if (currentPosition > 0) { currentPosition--; updateSliderPosition(); startAutoplay(); } }); nextBtn.addEventListener('click', () => { stopAutoplay(); if (currentPosition < maxPosition) { currentPosition++; updateSliderPosition(); startAutoplay(); } }); updateSliderPosition(); startAutoplay(); } });