Hier ein kurzes Beispiel, wie man via jQuery die Position eines Elements herausfindet und automatisch an diese Stelle scrollen kann. Wer sich noch nicht so gut mit jQuery- / CSS-Selektoren auskennt, sollte sich einmal folgenden Beitrag durchlesen. -> http://suckup.de/howto/jquery/crashkurs-jquery-selektoren/
.scrollTop() -> gibt die Scrollbar Position eines bestimmten Elements zurück
.scroll() -> wird ausgeführt, wenn gescrollt wird (event handler)
.animate() -> erzeugt animations Effekte via numerischer CSS-Einstellungen
.offset() -> gibt die Koordinaten (x,y) eines Elements zurück
.height() -> gibt die Höhe eines Elements zurück
Beispiel: jQuery_scroll.html
onClick=”$(‘#box’).show(); $(‘html,body’).stop(true,true); var target = $(‘#box’); var bottom = target.offset().top+target.height()-250; $(‘html,body’).animate({scrollTop: bottom}, 500); return false;”
-> bei “Klick” [onClick]
-> zeige das Element mit der ID “box” [#box] an
-> halte alle Animationen an [stop(true,true)]
-> die Höhe des Elements auf den x-Koordinate daraufrechnen [offset().top+target.height()]
-> zu der neuen Koordinate des Elements scrollen [animate({scrollTop: bottom}, 500)]