discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

hash scroll fixed

Browse Source
This commit is contained in:
bniwredyc 2023-01-19 15:46:14 +01:00
parent 838c4baa90
commit 008c0787a5
1 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/stores/router.ts
View File

@ -87,7 +87,15 @@ const handleClientRouteLinkClick = (event) => {
event.preventDefault() event.preventDefault()
if (url.hash) { if (url.hash) {
const anchor = document.querySelector(url.hash) let selector = url.hash
if (/^#\d+/.test(selector)) {
// id="1" fix
// https://stackoverflow.com/questions/20306204/using-queryselector-with-ids-that-are-numbers
selector = `[id="${selector.replace('#', '')}"]`
}
const anchor = document.querySelector(selector)
const headerOffset = 80 // 100px for header const headerOffset = 80 // 100px for header
const elementPosition = anchor.getBoundingClientRect().top const elementPosition = anchor.getBoundingClientRect().top
const newScrollTop = elementPosition + window.scrollY - headerOffset const newScrollTop = elementPosition + window.scrollY - headerOffset