Slideshow buttons don't work

JavaScript
1

Hi everyone,

I created a simple Slideshow using html5 and Javascript like that:

 <ul id="slides">
  <li class="slide showing"><img src="img/Bild1.jpg" width="420" height="290"></li>
  <li class="slide"><img src="img/Bild2.jpg" width="420" height="290"></li>
  <li class="slide"><img src="img/Bild3.jpg" width="420" height="290"></li>
  </ul>  
<button class="controls" id="previous">Previous</button>
<button class="controls" id="next">Next</button>

<script>
var slides = document.querySelectorAll('#slides .slide');
var currentSlide = 0;
var slideInterval = setInterval(nextSlide,4000);

function nextSlide() {
    slides[currentSlide].className = 'slide';
    currentSlide = (currentSlide+1)%slides.length;
    slides[currentSlide].className = 'slide showing';
}

var next = document.getElementById('next');
var previous = document.getElementById('previous');

next.onclick = function() {
    pauseSlideshow();
    nextSlide();
};
previous.onclick = function() {
    pauseSlideshow();
    previousSlide();
};
</script>

my problem is that the Slideshow is working very well, but the buttons do not. They are visible but not able to change the pictures.
Anyone who can help?

Thanks in advance

2

Hi there angelinaaaa,

and a warm welcome to these forums, :sunglasses:

I have not tested your code at all, but from a brief look at it, I cannot
see either the “pauseSlideshow” or the “previousSlide” function. :mask:

Have you actually coded them?

coothead

3

Hi Coothead,

first thanks for your answer. Actually the code is not fully done by myself, more a creation from different samples. But I thought the part “next.onlick=function” can be seen as the function.
Do you have an idea how the functions could look like? That would be great

4

Hello,

I think it’s working very well here is the example

5

Hm, maybe there’s a problem related to my MacBook. I’m going to check it on a different computer.

6

Is that in reply to the last post with the fiddle? FWIW that fiddle does not work for me, clicking previous and next does nothing.

Edit It does work, it just takes a long while to load the images. Once they are there it does work.

7

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.