langsam zu Anker fahren - nicht springen.

[surfer]

Hallo zusammen,
ich möchte gerne sehr viel Inhalt auf eine Seite packen und dem User die Möglichkei geben, via Anker zu einem bestimmten Abschnitt zu navigieren.

Jetzt die Schwierigkeit:
Die Seite soll langsam nach unten fahren und nicht einfach springen...

Kann mir jemand sagen, wie ich sowas angehen muss.

Vielen Dank.
Surfer

[rfb]

Moin

sowas geht per JavaScript window.srollBy()

Aber

• die User erwarten das Springen
• zum langsamen Scrollen gibts in den Browsern eingebaute Techniken, bei Bedarf aktiviere die User die selber

Gruß
rfb

[JürgenB]

Hallo surfer,

mit http://de.selfhtml.org/javascript/objekte/window.htm#scroll_to kannst Du eine Position auf der Seite anfahren.
mit http://de.selfhtml.org/javascript/objekte/all.htm#offset_top und http://de.selfhtml.org/javascript/objekte/all.htm#offset_parent bzw. http://de.selfhtml.org/javascript/objekte/anchors.htm#y ermittelst Du die aktuelle und die Zielposition. Das funktioniert auch mit DOM-Objekten. Ich zeige Dir mal meine Version, mit der ich die Position eines Elements ermittle:

function get_top(obj) {
 var curtop = 0;
 if (obj.offsetParent) {
  while (obj.offsetParent) {
   curtop += obj.offsetTop
   obj = obj.offsetParent;
  }
 }
 else if (obj.y)
  curtop += obj.y;
 return curtop;
}

(Habe ich hier: http://javascript.jstruebig.de/javascript/53/ abgeschrieben.)

Mit

window.scrollTo(0,get_top(document.getElementById("Resultate")));

springe ich dann direkt zum Element mit der Id "Resultate".
Du müsstest jetzt in einer mit http://de.selfhtml.org/javascript/objekte/window.htm#set_timeout verzögerten Schleife langsam Schritt für Schritt von der aktuellen zur Zielposition "hüpfen".
Vergiss aber nicht, für User ohne Javascript noch einen "HTML-Sprung" im Code zu lassen.

Gruß, Jürgen