Webseite automatisch scrollen lassen

  • Hallo zusammen,


    ich möchte eine Unterseite einer Homepage automatisch scrollen lassen.

    Keine Angst, die reguläre Homepage betrifft das nicht, jedoch soll eine Unterseite auf einem Anzeigemonitor dargestellt werden.

    Auf der Seite befindet sich eine Tabelle, die auch erweitert wird.

    Geladen wird die Seite von einem Raspi im Kiosk Mode Vollbild.


    Am liebsten hätte ich es so, dass die Seite geladen wird, dann bleibt die Startseite 20 Sekunden beispielsweise stehen und scrollt dann langsam an das Seitenende. Dort angekommen wieder 20 Sekunden stehen bleiben, danach Seite Neuladen wegen der Aktualisierungen und dann das Spiel von vorne.


    Ich habe es mal beschrieben wie im Browser. Anschauen, dann scrollen und dann F5.



    Könnt ihr mir da helfen? Ich könnte das in die Wordpressseite einbauen, jedoch habe ich keinen blassen Schimmer wie der JS Code aussehen muss. ;(

  • Nur noch ist gut ;)


    Der springt ganz schön.


    In einem anderen Forum fand ich mal folgenden Code.




    Das bewirkt, dass die Seite herunter scrollt und wenn sie unten angekommen ist, wieder nach oben. Er aktualisiert dabei aber auch nichts.

    Die Geschwindigkeit konnte ich einstellen, aber mehr bisher nicht.

  • Das bewirkt, dass die Seite herunter scrollt und wenn sie unten angekommen ist, wieder nach oben. Er aktualisiert dabei aber auch nichts.

    Die Geschwindigkeit konnte ich einstellen, aber mehr bisher nicht.

    Was soll er den genau aktualisieren?

    Die komplette Seite?

    Den Inhalt des gescrollten Fenster?

    Wo kommt der Inhalt her , wird der mit Ajax nachgeladen ?


    erstellt doch mal ein Beispiel von der Seite wie das aussehen soll ?

    Dann kann man sich das besser vorstellen was du meinst .

    Dein Code

    Runterscrollen lassen,

    20 Sekunden warten ,

    Seite neu laden ist ja kein Problem , aber wenn die Seite mit Ajax geladen wird könnte man den neu laden und nicht die ganze Seite.


    Sieht vielleicht erstmal kompliziert aus aber sollte funktionieren

    * Link entfernt, weil existiert nicht mehr *

  • Auch ohne jQuery kein Problem, wenn man von dem Schnipsel in Posting #3 ausgeht:

  • Hallo,


    sorry, dass ich erst heute Abend Zeit finde.

    Sagen aknn ich schonmal, dass die Abwandlung von Sempervivum genau das macht was ich möchte. Danke dafür.

    Die Parameter kann ich ja noch anpassen.


    Wozu das ganze und ein bisschen Erklärung.

    Also ich erstelle eine Seite in Wordpress für einen Schützenverein.

    Dort findet einmal jährlich ein Preisschießen statt. In diesem Jahr ist das Erste mal eine Homepage am Start.

    Die Ergebnisse werden ausgewertet und sollen dann automatiusch in die Homepage importiert werden. Das Importieren geht schon, nun muss ich noch mittels Makro in eine externe Datei exportieren.

    Auf der Homepage wird natürlich alles normal angezeigt mit Menü usw.


    Ich habe aber dann noch eine extra Seite erstellt, ohne Menü, wo dann nur eine Überschrift und die Tabelle drauf ist.

    Diese Seite und diese URL ist einzig alleine für einen Raspberry Pi im Kiosk Mode (Chilliepie).


    Während des Preisschießens lasse ich somit die Liste auf einem Fernsehr im Fullscreen Modus durchlaufen.


    Ich habe dafür einen Raspi ZeroW hinten an einem USB Port dran. An den Abenden starte ich den Fernseher und es lädt ein Chromium mit exakt dieser Seite.

    Natürlich passt die Tabelle nur am Anfang auf den Fernseher und wird immer länger, daher die Aktualisierung und dann soll diese langsam durchscrollen.

    Die "Überschrift" habe ich fixiert und diese blöeibt somit immer oben mit stehen.


    Das Ganze sieht dann so aus (geschwärzt wegen Daten von Personen)


    html-seminar.de/woltlab/attachment/2207/


    Das das Ganze in Wordpress ist, nur 2 Wochen verwendet wird und ausschließlich diesem Zweck dient, ist eigentlich nur die Funktion wichtig, nicht dass es eventuell schöner programmiert werden kann.

  • Hallo


    Ich möchte den Thread noch mal ausgraben.

    Leider kam das Ganze Coronabedingt im Jahre 2020 nicht zum Einsatz und auch 2021 und 2022 fielen ins Wasser.


    Ich habe den Code von Sempervivum für mich angepasst von den Zeiten und Scrollabständen. Das ist ja recht übersichtlich.


    Das läuft so absolut perfekt und reicht für die Zwecke, wie schon geschrieben.

    Ich frage mich jedoch, ob es möglich ist einen Sticky Header oder wie das heißt dabei zu berücksichtigen.


    Momentan scrollt er stumpf alles runter, das würde so auch gehen.

    Aber vielleicht lässt sich ja recht einfach definieren, dass er beispielsweise die ersten 200 Pixel/Zeilen oder wie auch immer man das nent stehen lässt und alles danach scrollt, wenn vorhanden.


    Könnt Ihr mir dabei noch mal helfen?

  • Hallo fnbalu , ich hoffe, das Preisschießen ist noch nicht vorbei, deine Frage liegt ja schon fast einen Monat zurück.


    Das Stichwort "sticky" ist genau was Du brauchst. Bringe den Teil, der nicht gescrollt werden soll, z. B. in einem header-Tag unter und gib diesem dieses CSS:


    Code
    header {
        position: sticky;
        top: 0;
        left: 0;
    }

Jetzt mitmachen!

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