CODEWITHSUNDEEP
javascriptjqueryhtmltypeerror
ForrestFairway
ForrestFairway

Reputation: 143

TypeError: slides[(slideIndex - 1)] is undefined

I have a question regarding a slide show I am building for an assignment. My debugging skills are not the best as I am new to HTML and JS. My problem comes from getting a typeError from a line in my slideshow JS. The problem is in this block here:

var slideIndex = 0;
showSlides();

function showSlides() {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  for (i = 0; i < slides.length; i++) {
    slides[i].style.display = "none";
  }
  slideIndex++;
  if (slideIndex > slides.length) {
    slideIndex = 1
  }
  slides[slideIndex - 1].style.display = "block";
  setTimeout(showSlides, 4000);
}

My HTML is:

    <img class="mySlides" src="http://www.kitchenaid.com/images/global/masthead-major-appliances.jpg">
<img class="mySlides" src="http://www.depotkitchen.com/wp-content/uploads/2015/05/kitchen-aid-appliances-1.jpg">
<img class="mySlides" src="http://washburns.com/media/k2/galleries/11/stainlesssteelkitchen2.jpg">
<img class="mySlides" src="https://www.appliancedepot.com/media/R37672.jpg">

The issue is with the line slides[slideIndex-1].style.display = "block"; I am getting the error:

TypeError: slides[{slideIndex-1)] is undefined.

Does anyone know a solution to this? Thanks for any help!

Here is a screenshot of the error on the debugging page:

Debugging page and error show cased

Upvotes: 2

Views: 7592

Answers (2)

SQH
SQH

Reputation: 36

I had the same problem. load the js file after the slider and problem solved.

Upvotes: 1

Banafshe Bamdad
Banafshe Bamdad

Reputation: 529

I had the same problem. I found that the <span> tags with "dot" class is removed, so I added &nbsp; between <span></span> tags and my problem solved.

Upvotes: 0

Related Questions