Christian: Seite scrollen lassen per Click

Hallo,

ich habe vor, den Besuchern zu ermöglichen, die Seite scrollen zu lassen, leider scrollt der Code von mir zu schnell:

function autoscroll()
{
x=0;
y=0;

while(x<10000)
{
window.scrollTo(x,y);
x=x+1;
y=y+1;
}}

Wie kann ich diese Funktion verlangsamen, so daß der User auch noch die Seite lesen kann?

Und wie ist es möglich da z.Bsp. per Linker Mausklick die Funktion abgebrochen wird?

Für Hilfe und Tipps und ein paar Codeschnipsel bin ich Euch dankbar.

Grüße
Christian

  1. Hallo.

    ich habe vor, den Besuchern zu ermöglichen, die Seite scrollen zu lassen, leider scrollt der Code von mir zu schnell:

    Du solltest mit setTimeout und scrollBy arbeiten.

    Wie kann ich diese Funktion verlangsamen, so daß der User auch noch die Seite lesen kann?

    Schleife raus, x und y raus und setTimeout und scrollBy rein. Mit setTimeout kannst du dann festlegen wie schnell er scrollen soll.

    Und wie ist es möglich da z.Bsp. per Linker Mausklick die Funktion abgebrochen wird?

    Mit document.onclick oder so was ähnlichem.

    Für Hilfe und Tipps und ein paar Codeschnipsel bin ich Euch dankbar.

    Das Ganze könnte z.B. so aussehn:

    <script type="text/javascript">
    <!--
     function as()
      {
       window.scrollBy(0,1);
       if(s) window.setTimeout("as()",100);
      }
     s = false;
     document.onclick = function(){if(s == true) s = false; else{s = true; as()}}
    //-->
    </script>

    Ein Klick startet das Scrolling, ein weiterer stoppt es, usw. Aber ob man sowas wirklich braucht ist doch ziemlich fraglich, wozu hab ich denn mein Mausrädchen?

    Gruß
    Norbert

    1. Ein Klick startet das Scrolling, ein weiterer stoppt es, usw. Aber ob man sowas wirklich braucht ist doch ziemlich fraglich, wozu hab ich denn mein Mausrädchen?

      Naja gibt arme Leute, die haben soetwas nicht. Hintergrund ist halt einfach daß man prima autoscrollen kann und in Ruhe die Nachricht bzw. den Artikel lesen kann.

      Laß JavaScript arbeiten und les in Ruhe ;-)

    2. <script type="text/javascript">
      <!--
       function as()
        {
         window.scrollBy(0,1);
         if(s) window.setTimeout("as()",100);
        }
       s = false;
       document.onclick = function(){if(s == true) s = false; else{s = true; as()}}
      //-->
      </script>

      Stürzt im Internet Explorer leider ab :(

      1. Hallo.

        Stürzt im Internet Explorer leider ab :(

        Tja, der IE, tz-tz-tz.

        Na ja, ich hab's im IE6 ausprobiert und da hat es funktioniert.
        Also, dann versuch mal das:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
        <html><head><title>AutoScroller</title>
        <script type="text/javascript">
        <!--
         s = false;
         function saso()
          {
           if(s){s = false; window.clearInterval(asa)}
           else{s = true; as()}
          }
         function as()
          {
           asa = window.setInterval("window.scrollBy(0,1)",100);
          }
        //-->
        </script>
        </head><body onclick="saso()">
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        <p>[...]</p><p>[...]</p><p>[...]</p>
        </body></html>

        Gruß
        Norbert

  2. Hallo,

    Wie kann ich diese Funktion verlangsamen, so daß der User auch noch die Seite lesen kann?

    var x=0;
    var y=0;
    function scroll(action)
    {
      x++;
      if (action="stop") x=10000;
      y++;
      if (x<10000);
      window.scrollTo(x,y);
      setTimeout('scroll()',50);
    }

    Die 50 bedeutet eine Verzögerung von 50ms, da mußt du eun wenig rumprobieren, was die beste Verzögerung ist.

    Und wie ist es möglich da z.Bsp. per Linker Mausklick die Funktion abgebrochen wird?

    <a href="#" onclick="scroll('stop')">Stop</a>

    Gruß Markus

    --
    alles wird gut...
    1. Hallo,

      var x=0;
      var y=0;
      function scroll(action)
      {
        x++;
        if (action="stop") x=10000;

      hier natürlich if (action=="stop") x=10000;

      y++;
        if (x<10000);
        window.scrollTo(x,y);
        setTimeout('scroll()',50);
      }

      Gruß Markus

      --
      alles wird gut...
    2. Hallo Markus,

      danke für Dein Codebeispiel, Problem nur, daß der Code nicht "stoppt" sondern auch bei Klick auf den Link weiterscrollt :(

      Was tun?

      1. Sorry,

        danke für Dein Codebeispiel, Problem nur, daß der Code nicht "stoppt" sondern auch bei Klick auf den Link weiterscrollt :(

        Da hat sich ein Fehler eingeschlichen, so müsste es gehen:
        var x=0;
        var y=0;
        function scroll(action)
        {
         x++;
         if (action=="stop") x=10000;
         y++;
         if (x<10000) {
          window.scrollTo(x,y);
          setTimeout('scroll()',50);
         }
        }

        Gruß Markus

        --
        alles wird gut...