»Nächstes« div nach Klick

  • Hi,

    ich habe hier diesen Code:
    https://codepen.io/nicerboy/pen/BXpjdz

    Das Ganze sollte aber nicht animiert sein. Bei Klick auf ein div sollte das nächste div (nichtanimiert) eingeblendet werden. Und das in Endlosschleife.

    Wie kann man das machen?

    Liebe Grüße

    (Ich hoffe, ich lerne dann damit langsam ein bisschen JavaScript. :))

  • Mit "nicht animiert" meinst Du wahrscheinlich, dass die Elemente abrupt, ohne Überblenden, wechseln sollen? Und mit "Bei Klick auf ein div", dass der Wechsel nicht automatisch erfolgen soll, sondern eben durch Klick?

  • Für 2 divs gibt es ja toggleClass. Für 3 oder mehr muß man sich da selbst was bauen ( brauche 9 Zeilen js ).

    Gbt es dafür schon was , oder sowas wie multitoggleClass ?

  • Mit addEventListener kannst Du eine Aktion beim Klick durchführen.

    Mit querySelektorAll kannst Du eine Nodelist, so eine Art Array, der drei Divs erzeugen.

    Dann eine Variable führen, die den Index des Elementes in der Nodelist angibt.

    diesen Index von Klick zu Klick um eins erhöhen und das alte Element unsichtbar und das neue sichtbar machen.

    Zum Nachschlagen empfehle ich Selfhtml.