Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Carousel / Slideshow
#1
Hallo, ich habe da noch ein zweites Problem und zwar mag mein Slider nicht. Seht ihr evtl den Fehler?

Javascript:
Code:
var slideIndex = 0;
carousel();

function carousel() {
   var i;
   var x = document.getElementsByClassName("produkt");
   for (i = 0; i < x.length; i++) {
     x[i].style.display = "none";
   }
   slideIndex++;
   if (slideIndex > x.length) {slideIndex = 1}
   x[slideIndex-1].style.display = "block";
   setTimeout(carousel, 2000); // Change image every 2 seconds
}
HTML (unverändert):
Code:
<div class="row">
            <div class="grid full">
                <div class="box no-height">
                
                    <h2>Angebote der Woche</h2>
                    <div class="product-list front">
                        <div class="produkt">
                            <a href="apfel.html">
                            <img src="img/small1.jpg"></a>
                            <p>Äpfel
                            <span class="preis">1,99 € <sup>*</sup></span></p>
                        </div>
                        <div class="produkt">
                            <a href="erdbeeren.html">
                            <img src="img/small2.jpg"></a>
                            <p>Erdbeeren
                            <span class="preis">1,99 € <sup>*</sup></span></p>
                        </div>
                        <div class="produkt">
                            <a href="gurke.html">
                            <img src="img/small3.jpg"></a>
                            <p>Gurken
                            <span class="preis">0,99 € <sup>*</sup></span></p>
                        </div>
                        
                        <div class="produkt">
                            <a href="fleisch.html">
                            <img src="img/small5.jpg"></a>
                            <p>Rind
                            <span class="preis">5,49 € <sup>*</sup></span></p>
                        </div>
                        
                        <div class="produkt">
                            <a href="eier.html">
                            <img src="img/small7.jpg"></a>
                            <p>Eier
                            <span class="preis">2,49 € <sup>*</sup></span></p>
                        </div>
                        <p><small>* alle Preise inkl. 19% gesetzl MwSt.</small></p>
                    </div>
                    <div style="clear:both;"></div>
                </div>
            </div>
        </div>
Alles unterhalb der Überschrift sollte automatisch durchlaufen, macht er aber nicht. Hab jetzt meine Änderungen wieder aus der HTML rausgenommen. Kann mir jemand sagen wie ich das in die HTML schreibe, damit das funktioniert? Oder muss da irgendwas spezielles in die CSS?
Zitieren
#2
Kann mir hier wirklich niemand weiterhelfen? Huh
Zitieren
#3
Funktioniert doch https://codepen.io/basti1012/pen/mKmzyZ
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste