Zum Anker in einer Datei springen
johny7
- javascript
1 Jeremy0 johny71 Der Martin0 ChrisB
1 JürgenB
Moin allerseits,
wir kennen ja alle die URL-Notation mit Angabe des Fragments nach dem Muster <a href="www.example.org#teil5">Teil 5 im Dokument</a>
.
Wenn ich nun meine ganze Seite mit AJAX realisiere, sprich alle Inhalte dynamisch lade, wie kann ich dann (z.B. nach einem Ereignis) zu diesem Fragment im Dokument springen?
Ich kann mir vorstellen, das Elternelement des betr. Ankers so lange zu scrollen, bis der Anker auf der Seite oben ist. So verhält sich zumindest der Browser. Gibt es denn eine elegantere Variante?
Wenn es für die Lösung relevant ist: Ich arbeite mit jQuery.
Vielen Dank im Voraus.
Grüße, JN
Auch wenn ich eher selten mit JavaScript arbeite, so ist mir window.location.hash
(http://de.selfhtml.org/javascript/objekte/location.htm#hash) im Kopf. Könnte sein, dass du das gesucht hast.
Liebe Grüße.
Moin allerseits,
Auch wenn ich eher selten mit JavaScript arbeite, so ist mir
window.location.hash
(http://de.selfhtml.org/javascript/objekte/location.htm#hash) im Kopf. Könnte sein, dass du das gesucht hast.
Danke für die Mühe, aber das löst nicht mein Problem. In location.hash wird gespeichert, welches Fragment bereits aufgerufen wurde. Ich will aber ein Fragment aufrufen. D.h. beim Klick auf einen Link wird die Standard-Aktion unterbunden und das Fenster soll zum Fragment scrollen.
Aber mir fällt gerade eine Frage ein, die das Problem lösen könnte: Wird beim Aufruf eines Fragments innerhalb einer Seite die Seite neu geladen? Wenn die Browser nämlich beim Aufruf eines Fragments einheitlich nur nach unten scrollen, wäre das alles kein Problem.
Und was passiert, wenn ich mit window.location.href dieselbe Seite mit Angabe eines Fragments lade? Wird die Seite dann neu geladen oder auch nur nach unten gescrollt? Funktioniert das browserübergreifend einheitlich?
Grüße, JN
Hallo,
location.hash
Danke für die Mühe, aber das löst nicht mein Problem.
bist du da sicher?
In location.hash wird gespeichert, welches Fragment bereits aufgerufen wurde. Ich will aber ein Fragment aufrufen.
Ja. Ebenso wie die Zuweisung an location.href dem Aufruf einer neuen Ressource entspricht, führt die Zuweisung an location.hash zum Anspringen eines Ankers.
Aber mir fällt gerade eine Frage ein, die das Problem lösen könnte: Wird beim Aufruf eines Fragments innerhalb einer Seite die Seite neu geladen?
Nein.
Und was passiert, wenn ich mit window.location.href dieselbe Seite mit Angabe eines Fragments lade? Wird die Seite dann neu geladen oder auch nur nach unten gescrollt? Funktioniert das browserübergreifend einheitlich?
Das solltest du testen. Eigentlich dürfte kein neuer Seitenaufruf stattfinden, darauf würde ich aber nicht blind vertrauen.
Ciao,
Martin
Hi,
Auch wenn ich eher selten mit JavaScript arbeite, so ist mir
window.location.hash
(http://de.selfhtml.org/javascript/objekte/location.htm#hash) im Kopf. Könnte sein, dass du das gesucht hast.
Danke für die Mühe, aber das löst nicht mein Problem. In location.hash wird gespeichert, welches Fragment bereits aufgerufen wurde. Ich will aber ein Fragment aufrufen. D.h. beim Klick auf einen Link wird die Standard-Aktion unterbunden und das Fenster soll zum Fragment scrollen.
Aber mir fällt gerade eine Frage ein, die das Problem lösen könnte: Wird beim Aufruf eines Fragments innerhalb einer Seite die Seite neu geladen?
Das alles hättest du schon selber herausfinden können, wenn du dir das verlinkte Beispiel und die Erklärung mal angeschaut hättest!
MfG ChrisB
Hallo johny7,
aus meiner Wühlkiste:
function get_top(obj) {
var curtop = 0;
if (obj.offsetParent) {
do {
curtop += obj.offsetTop
} while(obj = obj.offsetParent);
}
else if (obj.y)
curtop = obj.y;
return curtop;
}
window.scrollTo(0,get_top(document.getElementById("Resultate")));
http://de.selfhtml.org/javascript/objekte/all.htm#offset_parent
http://de.selfhtml.org/javascript/objekte/all.htm#offset_top
http://de.selfhtml.org/javascript/objekte/anchors.htm#y
http://de.selfhtml.org/javascript/objekte/window.htm#scroll_to
get_top ermittelt die Position eines Elements - in meinem Fall eine Überschrift mit der ID "Resultate", das ich dann mit scrollTo anspringe.
Gruß, Jürgen