Project Slideshow < > slide.classList.remove("active")); slides[index].classList.add("active"); updateActiveTitle(index); autoPlay(); } function updateActiveTitle(index) { const titles = document.querySelectorAll(".project-titles span"); titles.forEach(t => t.classList.remove("active")); if (titles[index]) { titles[index].classList.add("active"); titles[index].scrollIntoView({ behavior: 'smooth', inline: 'center' }); } } function autoPlay() { clearTimeout(timeout); const duration = slides[currentIndex].dataset.duration * 1000 || 5000; timeout = setTimeout(() => { currentIndex = (currentIndex + 1) % slides.length; changeSlide(currentIndex); }, duration); } slides.forEach((slide, index) => { const titleText = slide.querySelector("img").alt; const title = document.createElement("span"); title.innerText = titleText; title.addEventListener("click", () => { currentIndex = index; changeSlide(index); }); titlesContainer.appendChild(title); }); updateActiveTitle(currentIndex); autoPlay(); }); function scrollTitles(distance) { const container = document.getElementById("projectTitles"); container.scrollBy({ left: distance, behavior: 'smooth' }); }
