Erstellen eines Buttons, der zum Seitenanfang zurück verlinkt

[Rolf B]

Hallo Fabienne,

dazu verwendet man eine Hash-URL:

<a href="#">Top</a>

Was ist das? URLs bestehen aus Komponenten wie Protokoll (http:), Host (forum.selfhtml.org), Pfad zur Ressource (self/2019/may/16/erstellen-eines-buttons-der-zum-seitenanfang-zurueck-verlinkt) und Name der Ressource (1748845). Das sind jetzt die Komponenten der URL dieses Threads.

Dahinter kann man noch IDs auf einer Seite anspringen, wie es das Forum hier auch tut, z.B. #m174845.

Diese Komponenten sind teilweise optional. Die vollständige Adresse dieses Threads hier, mit Anspringen des Eröffnungspostings, ist

https://forum.selfhtml.org/self/2019/may/16/erstellen-eines-buttons-der-zum-seitenanfang-zurueck-verlinkt/1748845#m1748845

Man kann aber auch Teile davon weglassen. Der Browser ergänzt das dann basierend auf der Adresse der Seite, die gerade angezeigt wird. Beispiele:

Beginn mit //: Browser ergänzt das Protokoll https:

//forum.selfhtml.org/self/2019/may/16/erstellen-eines-buttons-der-zum-seitenanfang-zurueck-verlinkt/1748845#m1748845

Beginn mit /: Browser ergänzt Protokoll und Host, ggf. noch den Port - also https://forum.selfhtml.org. Wenn kein Hash-Teil hinten dran steht, wird zum Seitenanfang gesprungen.

/self/2019/may/16/erstellen-eines-buttons-der-zum-seitenanfang-zurueck-verlinkt/1748845

Keine Pfade, nur ein Ressourcenname. Browser würde https://forum.selfhtml.org/self/2019/may/16/erstellen-eines-buttons-der-zum-seitenanfang-zurueck-verlinkt davor setzen (und mutmaßlich nichts finden)

1741231#m1748845

Und schließlich: Nur ein Hash. Der Browser würde die Adresse der aktuellen Seite davor setzen, und wenn diese Seite schon aktiv ist, nur auf der Seite navigieren ohne zum Server zu gehen:

#m1749999

Die spezielle Hash-Erweiterung # steht für den Seitenanfang. href="#" wird demzufolge interpretiert als Anfang der gerade geladenen Seite.

Wenn Du nicht ganz an den Anfang willst, sondern zum Beginn eines Artikels, gib dem eine ID (z.B. id="artikel4711") und setze am Ende einen Link mit href="#artikel4711".

Rolf