javaScript not responding

JavaScript
1

hello, Good day.
i have a minor issue with my javascript file. I am trying to create a back to top button on a webpage. using css does not not quite cut it as it due to elements set to absolute at the top of the page. up on using js, the code didnt work, i tried an alert(); to check but it didn’t show. the page is well linked otherwise some other js functionalitites would not be working on the page. the js file works from the top to a certain point. i know there is an error but i cant seem to see it. below is the full js for the page.

let slides = document.querySelectorAll('.slide');
let dots = document.querySelectorAll('.dot');

function showSlides(n) {
 
  if (n > slides.length) { currentSlideIndex = 1; }
  if (n < 1) { currentSlideIndex = slides.length; }

  slides.forEach((slide, index) => {
    slide.style.opacity = '0';
    dots[index].classList.remove('active'); 
  });

  slides[currentSlideIndex - 1].style.opacity = '1';
  dots[currentSlideIndex - 1].classList.add('active');  

  document.querySelector('.slideshow-container').style.transform = `translateX(-${(currentSlideIndex - 1) * 100}%)`;
}

setInterval(() => {
  currentSlideIndex++;
  showSlides(currentSlideIndex);
}, 5000);

function currentSlide(n) {
  currentSlideIndex = n;
  showSlides(currentSlideIndex);
}

showSlides(currentSlideIndex);
/***********************************for nav******************************************/ 
const navLinks = document.querySelectorAll('#navigate a');

function removeActiveClasses() {
  navLinks.forEach(link => {
    link.classList.remove('active');
  });
}

function setActiveClass(index) {
  removeActiveClasses();
  navLinks[index].classList.add('active');
}

function highlightActiveLink() {
  const currentPage = window.location.pathname.split('/').pop(); 
  
  navLinks.forEach((link, index) => {
    const linkHref = link.getAttribute('href');
 
    if (linkHref === currentPage || linkHref === `./${currentPage}`) {
      setActiveClass(index);
    }
  });
}

window.addEventListener('DOMContentLoaded', highlightActiveLink);
/****************************alt svg color*************************************/
const svgIcon = document.getElementById('svg-icon');
svgIcon.addEventListener('load', function() {
  const svgDoc = svgIcon.contentDocument; 
  const svgElement = svgDoc.querySelector('circle');
  svgElement.setAttribute('fill', '#6A3F2C');
});
/*********************************hamburger menu***********************************/
/*********************************backToTopIcon********************************** */
let backToTop = document.getElementById('backToTop');
backToTop.addEventListener('click',   window.scrollTo({
  top: 0,
  behavior: 'smooth'
}));



/*********************************backToTopIcon********************************** */

and the attached are some screenshots that show the file path and link.

Capture 1
Capture 1167×285 4.24 KB

Capture
Capture360×118 3.67 KB

2

Your JavaScript looks good for me, do you see any error messages in the console ?

3

You need to wrap it in a callback.

let backToTop = document.getElementById("backToTop");
backToTop.addEventListener("click", () =>
  window.scrollTo({
    top: 0,
    behavior: "smooth"
  })
);