Javascript zum Seite-Scrollen

[Tim Graf]

Hallo!

Folgendes Problem: Ich (absoluter Javascript Anfänger...) muß ein Javascript in eine Webseite integrieren, daß per Klick auf einen Button in einem Frame, den derüberliegenden Frame langsam(!) nach links bzw. nach rechts scrollen lässt. In diesem Frame sind horizontal nebeneinander angeordnet mehrere Bilder vorhanden, und der Betrachter soll nun, immer ausgehend von der aktuellen Position per Mausklick zu einem beliebigen Bild hinscrollen können. Nun habe ich tatsächlich schon ein (mehr oder weniger) funktionierendes Script für diese Aufgabe ausgetüftelt... hier kommt's:

function HuschHusch(pos,speed)
{

if (navigator.appName == "Microsoft Internet Explorer")
   x = document.body.scrollLeft;
  else
   x = window.pageXOffset;
  
  if(x < pos)
   {
    while(x != pos)
     {
    x = x + speed;
    scrollTo(x,0);
   }
   }
  
  if(x > pos)
   {  
    while(x != pos)
     {
    x = x - speed;
    scrollTo(x,0);
   }
   }
  
}

Das Problem, daß ich mit diesem Script habe, ist das es zwar seine Zweck erfüllt aber leider regelmäßig auch den Broser zum Absturz bringt :-( Ich habe schon versucht irgendwie die Funktion setInterval() einzubauen, leider ging danach überhauptnixmehr... Zur Information: Die Variablen pos und speed, werden der Funktion mit dem ausruf über parent.framename.HuschHusch(x,y) übergeben.

Wäre wirklich klasse, wenn jemand einen Anregung hätte, wie das Script stabiler zu gestalten wäre ;-)

MfG, Tim

[Thomas J.]

Also ohne über die Funktionsweise nachzudenken, fällt mir folgendes auf:

function HuschHusch(pos,speed)

»»  {
»»

if (navigator.appName == "Microsoft Internet Explorer")

{ <-- Klammer fehlt

x = document.body.scrollLeft;

} <-- Klammer fehlt

else

{ <-- Klammer fehlt

x = window.pageXOffset;

} <-- Klammer fehlt
.
.
.

Vielleicht war's das ja schon.

Guten Tag übrigens, soviel Zeit muß sein.

[Tim Graf]

Tach auch!

Danke erstmal für Deine Antwort, ich habe die Klammern gesetzt, aber das Script ist leider immernoch sher instabil. Ich hatte die Klammern weggelassen weil ich dachte das diese nicht nötig seien, wenn hinter der Bedingung nur eine einzelne Anweisung erfolgt - öh, bei PHP ist das jedenfalls so ;-)

MfG, Tim

[Antje Hofmann]

Hallo Tim

function HuschHusch(pos,speed)

»»  {
»»

if (navigator.appName == "Microsoft Internet Explorer")
   x = document.body.scrollLeft;
  else
   x = window.pageXOffset;
  
  if(x < pos)
   {
    while(x != pos)
     {
    x = x + speed;
    scrollTo(x,0);
   }
   }

Ich schätze, dein speed wird nicht 1 sein, nehmen wir mal an, er ist zwei. Dein pos legen wir mal mit 12 fest.
Was passier in diesem Schleifenteil:

Fall a) x=2
        x<12 --> jetzt kommt deine Schleife, du fragst, solange x
                 ungleich 12 ist, soll er die schleife abarbeiten
         1.Lauf: x=2+2 => 4
         2.Lauf: x=4+2 => 6
         3.Lauf: x=6+2 => 8
         4.Lauf: x=8+2 => 10
         5.Lauf: x=10+2 => 12 12==12 => Die Schleife wird abgebrochen.

Fall b) x=3
        x<12 --> jetzt kommt deine Schleife, du fragst, solange x
                 ungleich 12 ist, soll er die schleife abarbeiten
         1.Lauf: x=3+2 => 5
         2.Lauf: x=5+2 => 7
         3.Lauf: x=7+2 => 9
         4.Lauf: x=9+2 => 11
         5.Lauf: x=11+2 => 13
         5.Lauf: x=13+2 => 15 ==> deine Abbruchbedingung wird niemals erreicht. Es entsteht eine unendliche Schleife (Absturz)

Viele Grüße

Antje

[Robert Kuhlemann]

Hallo!

Folgendes Problem: Ich (absoluter Javascript Anfänger...) muß ein

function HuschHusch(pos,speed)

»»  {
»»

if(x < pos)
   {
    while(x != pos)
     {
    x = x + speed;
    scrollTo(x,0);
   }
   }

Ein derartiger Schleifenaufbau empfiehlt sich nicht!
Man sollte hier nicht auf != abfragen, denn das Increment koennte den = -Wert nie erwischen und die Schleife liefe theoretisch ewig. Schleifen besser auf >=, >, <=, < abfragen.
Habe es kurz probiert. bei speed = 1 ist alles ok. bei speed = 2
hat man schon die ewige schleife.
Tip: man siehts deutlich, wenn man nach dem scrollTo() noch
'window.status = x' programmiert. Um die Werte von x zu verfolgen.

MfG Robert

[Tim Graf]

*an den Kopf klatsch*

Aber natürlich! Eigentlich völlig offensichtlich - ich habe nur nicht damit gerechnet, da ich für pos UND speed nur 5er-Werte angegeben habe. Doch ich habe dabei nicht bedacht, daß man den Scrollbalken ja auch "per Hand" verschieben kann, und in diesem Fall nützt es natürlich auch nichts, teilbare Werte anzugeben...

Ich habe das Problem jetzt ganz einfach umschifft, indem erstens den ungleich-Operator geben ein < bzw > ersetzt habe, und zweitens eine weitere Unterschleife ein das Script integriert habe, die abfragt, ob der Scrollbalken in die andere Richtung über das Ziel hinausgeschossen ist, und dementsprechend korrigiert:

if(x < pos)
  {
   while(x < pos)
      {
       timer=setTimeout('HuschHusch()', 10);
      x = x + speed;
      scrollTo(x,0);
      
      if (x > pos)
      {
       scrollTo(pos,0);
      }
    }
    }

Damit klappt alles super!

Vielen Dank Euch beiden, daß Ihr mich darauf hingewiesen habt! Manchmal sieht man den Wald eben vor lauter Bäumen nicht... ;-)

MfG, Tim