Seite 1 von 4 1234 LetzteLetzte
Ergebnis 1 bis 15 von 57
  1. #1
    nooneatall ist offline Jungspund
    registriert
    17-05-2013
    Beiträge
    16

    Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wieder

    Hallo,

    ich möchte gerne einen Vertretungsplan anzeigen lassen. Wenn der Inhalt größer ist, als der verfügbare Platz soll automatisch wie folgt gescrollt werden:
    - Seite anzeigen: 3 Sekunden
    - langsam nach unten scrollen
    - unten 3 Sekunden warten
    - wieder oben starten und 3 Sekunden warten...

    Bisher habe ich es ohne jegliche Kenntnisse durch die Suchfunktion bis hier geschafft:


    <html>
    <head>
    <script language="JavaScript">
    <!--
    function AutomatischScrollen()
    {
    window.scrollBy(0,1);
    Scrollen();
    }

    function Scrollen()
    {
    GescrollteZeit = window.setTimeout("AutomatischScrollen()", 30);
    }
    //-->
    </script>
    <title>Seite automatisch scrollen lassen</title>
    </head>
    <body onload="AutomatischScrollen();">

    Hier ist die erste Zeile Ihrer Webseite.
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> Hier sind Sie ganz unten angelangt.

    </body>
    </html>

    Die Seite scrollt beim Laden automatisch von oben nach unten. Was fehlt, sind die drei Sekunden zu Beginn, die Wartezeit unten und der Neustart von Beginn der Seite.

    Bin für jede Hilfe dankbar. Wenn man das scrollen auch realisieren kann, ohne die *.html zu bearbeiten, ist das noch besser. Ich habe eine css, aus der sich die Ansicht der html speist.

    Ich hoffe, meine Angaben sind ausreichen, um Hilfestellungen geben zu können.

    Schon vorab herzlichen Dank!

  2. #2
    Kasalop ist offline Routinier
    registriert
    29-08-2012
    Beiträge
    398

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    im prinzip hast du doch schon alle elemente drin... window.setTimeout macht dir ne Verzögerung und scrollBy scrollt deine seite.

    eventhandler in html-code ist unschön, das kannst du auch in ein script tag schreiben:

    Code:
    window.onload = function() {
      // code der ausgeführt wird, wenn das dokument fertig geladen hat
    }
    Das was dir noch fehlt ist die Abbruchbedingung für das scrollen (deinen neustart). Dafür musst du den aktuell gescrollten wert (scrollTop) vergleichen mit der höhe deines documents (abzüglich der höhe des anzeigebereichs natürlich). wenn das identisch ist, dann eben neustarten (scrollTo(0,0) und rest läuft wie gehabt weiter).

    Aber ob das wirklich gut ist stelle ich mal noch für dich in den Raum. Wenn man mal etwas einen Moment lesen will und das scrollt als weg, würde mich als lesenden ganz schön nerven!

    Lg Kasalop

  3. #3
    nooneatall ist offline Jungspund
    registriert
    17-05-2013
    Beiträge
    16

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Vielen Dank für die Antwort. Die Höhe des Dokuments ändert sich leider jeden Tag, da immer unterschiedliche Lehrer krank sind. Wie definiere ich denn dann die Höhe?

    Am liebsten wäre mir eine automatische Anpassung der Schriftgröße (Verkleinerung) und des Zeilenabstands (jetzt etwa bei 1,5), damit sich der Text verkleinert und der gesamte Inhalt in die Ansicht passt. Das Scrollen nervt die Kollegen schon arg. Sie müssten dann halt näher an den Bildschirm, bräuchten aber nicht mehr warten....

    Gibt's da was in der Richtung?

  4. #4
    Kasalop ist offline Routinier
    registriert
    29-08-2012
    Beiträge
    398

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    was? jetzt versteh ich nur noch bahnhof.
    Zitat Zitat von nooneatall Beitrag anzeigen
    Vielen Dank für die Antwort. Die Höhe des Dokuments ändert sich leider jeden Tag, da immer unterschiedliche Lehrer krank sind. Wie definiere ich denn dann die Höhe?
    na dynamisch... gib dem worin du es anzeigst einfach keine angabe von height, dann passt es sich automatisch seinem inhalt an.

    Zitat Zitat von nooneatall Beitrag anzeigen
    Am liebsten wäre mir eine automatische Anpassung der Schriftgröße (Verkleinerung) und des Zeilenabstands (jetzt etwa bei 1,5), damit sich der Text verkleinert und der gesamte Inhalt in die Ansicht passt.
    Wieso denn um Himmelswillen das? oO Das ist ja noch krausamer. Mach es so das man es lesen kann und wenns größer wird, als der Anzeige bereich muss eben gescrollt werden.

    Zitat Zitat von nooneatall Beitrag anzeigen
    Das Scrollen nervt die Kollegen schon arg.
    Deine Kollegen nervt, dass sie an einem scrollrad drehen müssen und wollen lieber, dass der bildschirm von alleine scrollt oO Also wenn das schon zu viel Arbeit ist, dann ist Lehrer/in aber eher der falsche Beruf xD (sry fürs offtopic, aber so ein Aufwand ist das doch nun eigentlich nicht...

    Zitat Zitat von nooneatall Beitrag anzeigen
    Sie müssten dann halt näher an den Bildschirm, bräuchten aber nicht mehr warten....
    jaaa und wenns im Winter mal ne größere Anzahl an Ausfällen gibt, ist die schriftgröße bei 5pt und niemand kanns mehr lesen, egal wie nah man am Bildschirm ist... sry aber das ist doch nicht wirklich gut durchdacht.

    Zitat Zitat von nooneatall Beitrag anzeigen
    Gibt's da was in der Richtung?
    Machen kann man fast alles. Aber ob es sinnvoll ist?!

    PS: mit meinem "vergleichen mit der höhe deines documents" hab ich eigentlich natürlich dynamisch gemacht... window.innerHeight beispielsweise...

  5. #5
    nooneatall ist offline Jungspund
    registriert
    17-05-2013
    Beiträge
    16

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Ich hätte erwähnen sollen, dass den Kollegen keine Maus zum scrollen zur Verfügung steht-der Bildschirm ist über VGA angeschlossen und steht im einem anderen Zimmer...

    Gut, das mit der Schriftgröße sehe ich ein.

    Wie muss ich denn jetzt die obige Datei genau anpassen, um das gewünschte (Tonic) zu erreichen? Kann mir einer den Code reinbasteln? Das wäre echt nett!

  6. #6
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.681

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Wsa auch immer gut funktioniert ist, wenn man die Scrollposition vor dem Scrollen speichert und dann mit der Position danach vergleicht. Wenn sich nichts geändert hat, ist man am Ende des Dokuments.

    PS: Dein HTML ist nicht valide - lass' das mal durch einen Validator durchlaufen.
    PPS: window.setTimeout sollte man keinen String als Parameter übergeben, sondern eine Funktionsreferenz. Bei dir würde das dann so aussehen:
    Code:
    window.setTimeout(AutomatischSrollen, 30);

  7. #7
    nooneatall ist offline Jungspund
    registriert
    17-05-2013
    Beiträge
    16

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Sooo... Danke für die Rückme
    Bin ein Stückchen weiter...
    Die Seite Startet jetzt nach 5 Sekunden. Welche Befehle brauche ich denn, um den Scrollfortschritt zu prüfen und für die Abbruchbedingung? An welche Stelle setze ich das ein?
    So weit bin ich jetzt:

    <html>
    <head>
    <script language="JavaScript">
    <!--
    function AutomatischScrollen()
    {
    setTimeout(function() { window.scrollBy(0, 1); }, 5000);
    Scrollen();
    }
    function Scrollen()
    {
    GescrollteZeit = window.setTimeout("AutomatischScrollen()", 40);
    }
    //-->
    </script>
    <title>Seite automatisch scrollen lassen</title>
    </head>
    <body onload="AutomatischScrollen();">


    Hier ist die erste Zeile Ihrer Webseite.
    <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><b r> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><b r> Hier sind Sie ganz unten angelangt.

    </body>
    </html>

    Bin für weitere Hilfe mehr als dankbar!

  8. #8
    Kasalop ist offline Routinier
    registriert
    29-08-2012
    Beiträge
    398

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Dein code mag zwar funktionieren. Ergibt aber keinen sinn. weiterhin bitte nutze die code-tags!

    Lg Kasalop

  9. #9
    nooneatall ist offline Jungspund
    registriert
    17-05-2013
    Beiträge
    16

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Vielen Dank für die Rückmeldung. Habe gerade copy paste gemacht - habe so die tags vergessen. Sorry.
    Ich weiß jetzt, dass es so keinen Sinn macht, wie es besser geht weiß ich leider immer noch nicht. Kannst du mir bitte mal einen konkreten Verbesserungsvorschlag machen? Das wäre echt nett.

  10. #10
    Kasalop ist offline Routinier
    registriert
    29-08-2012
    Beiträge
    398

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    okay. du musst lernen ein konzept zu entwickeln. Das brauchst du immer beim Programmieren:
    1. Startup: 5 sekunden warten
    2. nun kontinuierlich scrollen bis man ganz unten ist.
    3. nach oben springen und wieder mit punkt 2 weitermachen

    1. setTimeout(startscrolling, 5000);
    2. setInterval(scroll, 1);
    3. if(oldScrollposition == newScrollposition) window.scrollTo(0,0);

    So nun blicken wir uns das Konzept an und stellen fest, dass die wohl funktioniert, dass wir aber mit Punkt 2 Probleme bekommen, wenn zum scrollen mehr Zeit als eine Sekunde benötigt wird (überlagerung der Aufrufe). Daher lösen wir das ganze nun auf in setTimeout aufrufe:
    2.1 function scroll() {
    // aktion ausführen zum scrollen.
    setTimeout(scroll, 1);
    }
    Damit kann es nicht mehr zu einer überlagerung kommen, da wir scroll erst erneut aufrufen, wenn das alte abgearbeitet ist.

    gesamt haben wir dann:
    Code:
    window.onload = function() {
      setTimeout(startscrolling, 5000);
    }
    var oldScrollposition=0, newScrollposition=0;
    function startscrolling() {
      oldScrollposition = 0
      newScrollposition = 0;
      window.scrollTo(0,0);
      scroll();
    }
    function scroll() {
      window.scrollBy(0,1);
      newScrollposition = window.scrollTop;
      if(oldScrollposition == newScrollposition)
        startscrolling();
      else {
        oldScrollposition = newScrollposition;
        setTimeout(scroll, 1);
      }
    }
    Nun könnte man das noch dahin optimieren, dass wir keine globalen Parameter mehr haben. Entweder eine klasse schreiben, oder eben in nen wrapper packen.

    Lg Kasalop

  11. #11
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.681

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Naja - man könnte den Code auf jeden Fall dahin optimieren, dass er funktioniert... window.scrollTop gibt es nicht. Die Scrollposition des Fensters bekommt man über window.pageYOffset oder (ältere IEs) document.documentElement.scrollTop

    Auch ist ein Pixel pro Millisekunde doch etwas zu schnell zum scrollen... 1000px pro Sekunde - da kann wirklich niemand mehr was lesen. Ich würde ja so alle 40ms um 2 Pixel scrollen - da hat man ~50px/s und könnte auch mit window.setInterval() arbeiten (muss aber nicht...).

    Zusätzlich würde ich die alte Scrollposition nicht in einer (semi-)globalen Variablen speichern... man kann ja die Scrollposition direkt vor scrollBy und direkt danach auslesen - dann kann man komplett mit lokalen Variablen arbeiten.

  12. #12
    Kasalop ist offline Routinier
    registriert
    29-08-2012
    Beiträge
    398

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Zitat Zitat von kkapsner Beitrag anzeigen
    Naja - man könnte den Code auf jeden Fall dahin optimieren, dass er funktioniert... window.scrollTop gibt es nicht. Die Scrollposition des Fensters bekommt man über window.pageYOffset oder (ältere IEs) document.documentElement.scrollTop[/code]
    wäre seine Aufgabe gewesen das rauszufinden. Aber so gehts auch ^^

    Zitat Zitat von kkapsner Beitrag anzeigen
    Auch ist ein Pixel pro Millisekunde doch etwas zu schnell zum scrollen... 1000px pro Sekunde - da kann wirklich niemand mehr was lesen. Ich würde ja so alle 40ms um 2 Pixel scrollen - da hat man ~50px/s und könnte auch mit window.setInterval() arbeiten (muss aber nicht...).
    setInterval hab ich oben ja angesprochen, würde ich hier nicht nehmen.

    Zitat Zitat von kkapsner Beitrag anzeigen
    Zusätzlich würde ich die alte Scrollposition nicht in einer (semi-)globalen Variablen speichern... man kann ja die Scrollposition direkt vor scrollBy und direkt danach auslesen - dann kann man komplett mit lokalen Variablen arbeiten.
    Doppelte auslesen einer Eigenschaft? Kein sehr schöner Stil. Ne Klasse wäre die bessere Option an der Stelle, wollte ich dem TE aber nicht zumuten.

    Lg Kasalop
    Geändert von mikdoe (19-05-2013 um 19:14 Uhr) Grund: Zitat korrigiert

  13. #13
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.681

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Ich lese eine Eigenschaft lieber doppelt aus, als dass ich globale Variablen verwende... außerdem kann ich dann sicher sein, dass ich mit den richtigen Werten arbeite. In einem anderen Fall (also wenn der Benutzer auch ein Eingabegerät für den Rechner hat) könnte ja noch irgendwie anders gescrollt werden und dann wäre es nicht mehr sicher, dass der Wert, den du in der "Klasse" (NB: es gibt in JS keine Klassen) gespeichert hast, auch korrekt ist.
    Ich finde das nicht, dass das schlechter Stil ist... aber das ist Ansichtssache.

  14. #14
    Sempervivum ist offline Banned
    registriert
    11-12-2012
    Beiträge
    555

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Also ich würde das ganze ganz anders machen: Den gesamten Content in einen div-Container legen und mit jQuery-animate verschieben:
    Code:
          $(document).ready(function(){
              var scrollamount = $(document).height() - $(window).height();
              var scrollduration = scrollamount * 10;
              var pauseduration = 3000;
              var docheight = $(document).height();
              jQuery.fn.doScroll = function() {
                  $(this).delay(pauseduration)
                      .animate({top: -scrollamount, height: docheight}, scrollduration, 'linear')
                      .delay(pauseduration)
                      .animate({top: 0, height: $(window).height()}, scrollduration, 'linear', $(this).doScroll);
    
                  };
              $('#globdiv').height($(window).height()).doScroll();
          });
    HTML-Code:
    <div id="globdiv" style="position: absolute; overflow: hidden;">
    Hier dein gesamter Content
    </div>
    (Die Animation mit der Höhe habe ich gemacht, um die hässliche Aktivität der Scrollbar zu unterdrücken.)
    Geändert von Sempervivum (20-05-2013 um 01:05 Uhr)

  15. #15
    Kasalop ist offline Routinier
    registriert
    29-08-2012
    Beiträge
    398

    AW: Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wied

    Zitat Zitat von kkapsner Beitrag anzeigen
    Ich lese eine Eigenschaft lieber doppelt aus, als dass ich globale Variablen verwende... außerdem kann ich dann sicher sein, dass ich mit den richtigen Werten arbeite. In einem anderen Fall (also wenn der Benutzer auch ein Eingabegerät für den Rechner hat) könnte ja noch irgendwie anders gescrollt werden und dann wäre es nicht mehr sicher
    Das ist für mich aber ein Fall von: richtige Anforderungsanalyse erstellen. (Was nebenbei den Unterschied zwischen einem normalen Fachinformatiker (ein guter wird das natürlich auch können) und einem stduierten Informatiker ist) Womit ich nicht sagen will das du das eine oder andere bist xD Bitte nicht falsch verstehen! Fiel mir grad nur auf, dass das oft ein entscheidender Unterschied ist.
    BTT: Könnte man auch lösen durch nutzen von onscroll.

    Zitat Zitat von kkapsner Beitrag anzeigen
    (NB: es gibt in JS keine Klassen)
    Ja ich weiß. und diese ständige unterscheidung und dieses darauf beharren (was ich früher auch gemacht habe) stört mich aber langsam. Man kann ein prototypebasiertes System nahezu 1-zu-1 in ein klassensystem konvertieren, also wieso darauf zu extrem beharren, dass es in js keine klassen gibt? Wenn ich per function Klassenname() {} eine schablone anlegen und diese per new Klassenname() instanzieren kann und ein Objekt erhalte finde ich das man das durchaus vertreten kann. Klar gibt es sonderfälle die ich beim prototyping machen kann, die bei einem normalen Klassensystem nicht gehen, aber ich kann alles was im einen geht, im anderen nachbilden (Mal abgesehen von Interfaces, oder ich kenne es im prototype system nicht, kA).
    Daher gibts ja auch ne Sprache, die Klassen, vererbung, etc unterstützt, welches dann zu js konvertiert werden kann. (Schau dir, falls du es nicht kennst, mal TypeScript an. Bin mir noch nicht ganz sicher wie gut es mir gefällt, aber wirkt erstmal recht nett.)

    Ich finde das nicht, dass das schlechter Stil ist... aber das ist Ansichtssache.
    okay einigen wir uns auf Ansichtssache. Ist es eh in den meisten Fällen in der Informatik. Für mich gehört sowas in ein Model und das Model wird nicht mit der View vermischt, insofern es geht. Daher würde ich einen alten Wert den ich bereits schonmal ausgelesen habe ins Modell speichern und nicht nochmal auslesen.
    Andererseits hab ich das oben natürlich auch nicht ganz sauber umgesetzt allerdings hauptsächlich ums für den TE einfach zu halten.

    Lg Kasalop

Seite 1 von 4 1234 LetzteLetzte

Ähnliche Themen

  1. Automatisches scrollen nach 3 Sekunden beenden
    Von Trossed0200 im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 30-07-2012, 02:18
  2. Automatisch nach OBEN Scrollen
    Von oli-bt im Forum JavaScript
    Antworten: 4
    Letzter Beitrag: 06-05-2007, 23:10
  3. Automatisch weiterladen nach x sekunden
    Von Snacke im Forum Serverseitige Programmierung
    Antworten: 9
    Letzter Beitrag: 18-11-2005, 21:12
  4. Automatisch beim öffnen nach oben scrollen
    Von Tep im Forum Allgemeines
    Antworten: 1
    Letzter Beitrag: 26-03-2005, 14:20
  5. onunload......5 sekunden eine pause
    Von Bernhard84 im Forum JavaScript
    Antworten: 4
    Letzter Beitrag: 28-08-2002, 20:00

Stichworte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •