Problem mit position:sticky und div box
bearbeitet von Gunnar Bittersmann@@Gunnar Bittersmann
> Wenn ein seiteninterner Anker (`section`) angesprungen wird, landet der ja oben am Seitenanfang und wird durch den *sticky header*{:@en} verdeckt. Da wir dessen Höhe nicht kennen (Schriftart, -größe; s.o.), muss diese mit JavaScript ausgelesen werden und ermittelt werden, ob und um wieviel da noch zu scrollen ist.
Das hatte ich im [Paralleluniversum](https://codepen.io/gunnarbittersmann/pen/Orzrgy) beim `hashchange`-Event gemacht. Das reicht aber nicht.
Wenn man auf „Next Generation“ clickt[^picard] und dann noch mal, springt der Abschnitt nach oben, d.h. hinter den *sticky header*{:@en}. Da das `hashchange`-Event nicht erneut feuert, wird das nicht korrigiert.
Das Zeugs sollte auch ausgeführt werden, wenn mal auf einen seiteninternen Link clickt. Sowie initial beim Laden der Seite, wenn diese schon mit *fragment identifier*{:@en} im URL aufgerufen wird.
Mal sehen, vielleicht passe ich das im Pen noch an.
[^picard]: wo ich heute schon mal [über Picard (un)sinniert](https://twitter.com/g16n/status/1081116044788408321) hatte 🤣
LLAP 🖖
--
*„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann
Problem mit position:sticky und div box
bearbeitet von Gunnar Bittersmann@@Gunnar Bittersmann
> Wenn ein seiteninterner Anker (`section`) angesprungen wird, landet der ja oben am Seitenanfang und wird durch den *sticky header*{:@en} verdeckt. Da wir dessen Höhe nicht kennen (Schriftart, -größe; s.o.), muss diese mit JavaScript ausgelesen werden und ermittelt werden, ob und um wieviel da noch zu scrollen ist.
Das hatte ich im [Paralleluniversum](https://codepen.io/gunnarbittersmann/pen/Orzrgy) beim `hashchange`-Event gemacht. Das reicht aber nicht.
Wenn man auf „Next Generation“ clickt[^picard] und dann noch mal, springt der Abschnitt nach oben, d.h. hinter den *sticky header*{:@en}. Da das `hashchange`-Event nicht erneut feuert, wird das nicht korrigiert.
Das Zeugs sollte auch ausgeführt werden, wenn mal auf einen seiteninternen Link clickt. Sowie initial beim Laden der Seite, wenn diese schon mit *fragment identifier*{:@en} im URL aufgerufen wird.
Mal sehen, vielleicht passe ich das im Pen noch an.
[^picard]: wo ich heute schon mal [über Picard gesonnen](https://twitter.com/g16n/status/1081116044788408321) hatte 🤣
LLAP 🖖
--
*„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann