Navigation / Buttons von Slideshow funktionieren nicht

  • Hallo alle zusammen,


    ich habe folgende simple Slideshow erstellt:



    <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>



    Mein Problem ist, dass die Slideshow wie gewollt sichtbar ist und funktioniert, die Buttons jedoch nur sichtbar sind aber nicht funktionieren, also die Bilder sich nicht vor oder zurück klicken lassen. ?( Gibt es vielleicht jemanden der mir weiter helfen kann?


    Vielen Dank schon einmal!

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!