kati: Scroll funktion

Hallo miteinander!

Ich will eine Fotogalerie machen, bei der der "index" der Bilder angezeigt wird (hier sind es 6 Bilder)

Jetzt werden aber immer nur 3 Bilder angezeigt. Ich will, dass man über einen Button ("weiter") scrollen kann. Es rutscht immer um ein Bild nach rechts. Wenn man aber beim Bild 6 angelangt ist, sollte wieder das Bild 1 kommen.
also so:
Start:
|Bild 1||Bild 2||Bild 3|
                <weiter>
click auf weiter
|Bild 2||Bild 3||Bild 4|
                <weiter>
click auf weiter
|Bild 3||Bild 4||Bild 5|
                <weiter>
click auf weiter
|Bild 4||Bild 5||Bild 6|
                <weiter>
click auf weiter
|Bild 5||Bild 6||Bild 1|
                <weiter>
click auf weiter
|Bild 6||Bild 1||Bild 2|
                <weiter>

Ich komme einfach auf keien lösungsansatz und wäre extrem froh wenn mir jemand einen geben köntne.

gruss kati

  1. Ich komme einfach auf keien lösungsansatz und wäre extrem froh wenn mir jemand einen geben köntne.

    was hast du bisher versucht?

    1. was hast du bisher versucht?

      nichts richtiges, weils immer irgendwo aneckt, vorallem der teil mit dem "Unendlichen bilder kreis".

      Ich hab voll ein blackout, und komm auf gar nix. :'(

      1. was hast du bisher versucht?

        nichts richtiges, weils immer irgendwo aneckt, vorallem der teil mit dem "Unendlichen bilder kreis".

        nichts ist relativ wenig - du solltest vielleicht erstmal eine html-seite erstellen, die die bilder in einer reihe anzeigt - die bilder kommen in ein element welches die anzeige mit overflow: hidden einfach nach 3 bildern abschneidet

        um den unendlichen kreis brauchst du dich aktuell nicht kümmern, den gibt es garnicht

        1. nichts ist relativ wenig - du solltest vielleicht erstmal eine html-seite erstellen, die die bilder in einer reihe anzeigt - die bilder kommen in ein element welches die anzeige mit overflow: hidden einfach nach 3 bildern abschneidet

          ja klar hab ich die. hier mit 5 Bilder und overflow:hidden;

          http://www.gauchbeschriftet.ch/gauch/baugrafik/galerie/index.php

          aber eben weiter komm ich nicht

          1. ja klar hab ich die. hier mit 5 Bilder und overflow:hidden;

            nein, du hast nicht overflow hidden, du hast einen scrollbalken - sieht nach overflow auto aus

            aber eben weiter komm ich nicht#

            jetzt gehts daran, das dom mit javascript zu manipulieren - damit du den endloseffekt hinbekommst, sollen die bilder die jetzt links stehen, nach denen die jetzt rechts stehen nochmal anknüpfen - zumindest 5 bzw 4 stück (bei 5 bildern)

            damit du dein dokument mit javascript ordentlich manipulieren kannst und alle dom operationen einwandfrei funktionieren, empfehle ich zu allererst einen validen quelltext

      2. Hallo,

        was hast du bisher versucht?

        nichts richtiges, weils immer irgendwo aneckt, vorallem der teil mit dem "Unendlichen bilder kreis".

        Halte die Bilder in einem Array vor. Dann kannst du mit jedem Klick auf den Weiter-Button eine Kreisrotation des Arrays wie folgt vornehmen:

          
        // bilder sei das Array mit den Bildern  
        bilder.push(bilder.shift());  
        
        

        Das entfernt das erste Element und fügt es am Ende an. Zurückscrollen kannst du dann entsprechend:

          
        // bilder sei das Array mit den Bildern  
        bilder.unshift(bilder.pop());  
        
        

        Gruß, Don P

        1. Danke!

          Du hast mir genau den richtigen Ansatzpuntk gegeben!!

          Ich mach es zwar nicht mit pop() und shift() aber es funktioniert schon fast!

          Danke nochmals!!

          1. Hallo,

            Ich mach es zwar nicht mit pop() und shift() aber es funktioniert schon fast!

            Nicht mit pop()? Arrays poppen macht aber Spaß ;-)

            Noch cooler vom Quelltext her wäre:

            // vorwärts scrollen:
            with(bilder){push(shift())}

            // bzw. rückwärts scrollen:
            with(bilder){unshift(pop())}

            Danke nochmals!!

            Gärn gscheh, denn in Bärn hilf ig gärn, als Mani Matter Fan :-))

            Gruß, Don P