Hallo,
Ich hoffe, ihr seid wohlauf?!
Momentan suche ich nach der korrekten Syntax für Anker und Sprungmarken, die dann natürlich auch ordentlich funktionieren sollen.
Zunächst mal ein paar Basics zur Überprüfung.
Bsp: von einem Link auf der Seite A zu einer Überschrift auf Seite B springen.
Sprungmarke auf Seite A:
Anker auf Seite B:
Die Sprungmarke auf eine andere Seite braucht die Angabe der relativen URL.
1) Stimmt es, dass es ausreicht, wenn man bei einer Sprungmarke innerhalb derselben Seite nur ein # ohne relative URL schreiben kann?
Oder ist es doch besser mit einer relativen URL? Oder doch gleich die absolute URL?
2) "/" gibt doch an, dass es im selben Hauptverzeichnis liegt? Ist es dann überhaupt notwendig?
Wenn ich aus einem tieferliegenden Verzeichnis in ein höheres zurückwill, muss ich "/Ordnername/seitenname.html" angeben?
Wann oder warum verwendet man "./" oder "../".
Was die Funktion betrifft, sind mir 3 Probleme aufgefallen, wo ich weder Ursache, noch Lösung kenne.
Ich bitte um euren Rat, weil mich meine Recherche grad nur noch mehr verunsichert hat.
1) Wenn ich auf die Sprungmarke klicke, springt es zwar zum gewünschten Textteil, allerdings immer unterhalb der zugehörigen Überschrift. Die Überschrift ist nicht mehr zu sehen. kennt jemand von euch dieses Phänomen? Wie kann man das ändern?
Ich hab mich gefragt, ob das vielleicht mit dem sticky header und der Höhe zusammenhängt, probiert hab ich noch nix, weil ich nicht weiß, an welcher Schraube ich da drehen soll.
2) Statt dem Sprung soll gescrollt werden.
Habe im css
Das funktioniert sowohl auf derselben seite als auch, nach dem tatsächlichen Sprung, auf eine andere Seite sehr schön.
Aber:
Wenn ich den scroll-up-button klicke, der über jQuery läuft, dann beginnt das Raufscrollen ein paar Zentimeter zaghaft und dann scrollt es hoch, als wär eh nix gewesen.
Woran liegt das?
3) Seit Neuestem muss ich manchmal 2x auf eine Sprungmarke klicken, damit der Sprung innerhalb derselben Seite ausgelöst wird. Beim 1. Klick zuckt die Seite kurz, bleibt aber dort wo sie ist.
"Manchmal" bedeutet, es war so in Chrome (Mac und mobil auf Android), ebenso in der live preview in Brackets.
Nachdem ich das Cache gelöscht hab, funktioniert es wieder, bis es dann wieder nicht geht.
(Der Sprung auf eine andere Seite funktioniert jederzeit tadellos, vorausgesetzt der Pfad ist richtig :) )
Hat das schon mal jemand von euch beobachtet? Gibts dafür eine Erklärung und ev. auch eine Lösung?
lg, ansophie
Ich hoffe, ihr seid wohlauf?!
Momentan suche ich nach der korrekten Syntax für Anker und Sprungmarken, die dann natürlich auch ordentlich funktionieren sollen.
Zunächst mal ein paar Basics zur Überprüfung.
Bsp: von einem Link auf der Seite A zu einer Überschrift auf Seite B springen.
Sprungmarke auf Seite A:
<a href=“/Seite-B.html#Nr_1“>Spring zu Nr. 1 auf Seite B</a>
.Anker auf Seite B:
<h1 id=„Nr_1“ name=„Nr_1“>Nr. 1</h1>
.Die Sprungmarke auf eine andere Seite braucht die Angabe der relativen URL.
1) Stimmt es, dass es ausreicht, wenn man bei einer Sprungmarke innerhalb derselben Seite nur ein # ohne relative URL schreiben kann?
Oder ist es doch besser mit einer relativen URL? Oder doch gleich die absolute URL?
2) "/" gibt doch an, dass es im selben Hauptverzeichnis liegt? Ist es dann überhaupt notwendig?
Wenn ich aus einem tieferliegenden Verzeichnis in ein höheres zurückwill, muss ich "/Ordnername/seitenname.html" angeben?
Wann oder warum verwendet man "./" oder "../".
Was die Funktion betrifft, sind mir 3 Probleme aufgefallen, wo ich weder Ursache, noch Lösung kenne.
Ich bitte um euren Rat, weil mich meine Recherche grad nur noch mehr verunsichert hat.
1) Wenn ich auf die Sprungmarke klicke, springt es zwar zum gewünschten Textteil, allerdings immer unterhalb der zugehörigen Überschrift. Die Überschrift ist nicht mehr zu sehen. kennt jemand von euch dieses Phänomen? Wie kann man das ändern?
Ich hab mich gefragt, ob das vielleicht mit dem sticky header und der Höhe zusammenhängt, probiert hab ich noch nix, weil ich nicht weiß, an welcher Schraube ich da drehen soll.
2) Statt dem Sprung soll gescrollt werden.
Habe im css
html { scroll-behavior: smooth; }
eingetragen.Das funktioniert sowohl auf derselben seite als auch, nach dem tatsächlichen Sprung, auf eine andere Seite sehr schön.
Aber:
Wenn ich den scroll-up-button klicke, der über jQuery läuft, dann beginnt das Raufscrollen ein paar Zentimeter zaghaft und dann scrollt es hoch, als wär eh nix gewesen.
Javascript:
$(".btn__scroll-up").click(function () {
return $("html, body").animate({
scrollTop: 0
}, 800), !1
});
Woran liegt das?
3) Seit Neuestem muss ich manchmal 2x auf eine Sprungmarke klicken, damit der Sprung innerhalb derselben Seite ausgelöst wird. Beim 1. Klick zuckt die Seite kurz, bleibt aber dort wo sie ist.
"Manchmal" bedeutet, es war so in Chrome (Mac und mobil auf Android), ebenso in der live preview in Brackets.
Nachdem ich das Cache gelöscht hab, funktioniert es wieder, bis es dann wieder nicht geht.
(Der Sprung auf eine andere Seite funktioniert jederzeit tadellos, vorausgesetzt der Pfad ist richtig :) )
Hat das schon mal jemand von euch beobachtet? Gibts dafür eine Erklärung und ev. auch eine Lösung?
lg, ansophie