how I can solve this problem (uncaught TypeError: cannot read properties of undifined (readingstyle) with slidershow from W3schools ?

[johannes999]

hello,

this code for slidershow is from W3 schools;

 

<script>
let slideIndex = 0;
showSlides();

function showSlides() {
  let i;
  let slides = document.getElementsByClassName("mySlides");
  let dots = document.getElementsByClassName("dot");
  for (i = 0; i < slides.length; i++) {
    slides[i].style.display = "none";  
  }
  slideIndex++;
  if (slideIndex > slides.length) {slideIndex = 1}    
  for (i = 0; i < dots.length; i++) {
    dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";  
  dots[slideIndex-1].className += " active";
  setTimeout(showSlides, 2000); // Change image every 2 seconds
}
</script>

 

it is working very well but when I open my websites home page there is no problem but when I open  other pages   and go to inspect element I see this error:

(index):1331 Uncaught TypeError: Cannot read properties of undefined (reading 'style')
    at showSlides ((index):1331:24)
    at window.onload ((index):1317:1)

I searched in google for solution and found this option:

		window.onload = function() {
//code goes here
};

but it didn't help . I couldn't find any solution .  it tells that  .style.display = "block"  is not defind .  and problem with the line:   showSlides() ;

 this code is from  W3schools  where is the fault or how I can fix this problem?

thanks          my url is:     https://webdesignleren.com/onderhoud/

[dsonesuk]

Remember length starts from 1, index from 0, this error usually happens when a index of element doesn't exist because its exceeded the max index number.

[jess1234]

i have this same problem was it solved please?