#217 Create smooth scroll behaviour and add padding-top to jumplinks on a page.

<staging:8080>/

The scroll behaviour for jumplinks scroll on top of the element which due to the sticky menubar being on top blocks the element from being seen.

I would like…

`staging:8080/listpage/

Apply padding-top to the element to allow for the title to be seen and also apply smooth scrolling behaviour for a nicer transition.

so this is two fold solution:

https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollTo

is how you tell the browser to smooth scroll to.

You will need to get the Y position on the page with something like document.querySelector('#a').offsetY

…and you will need to modify the menu to fire a click function instead of being a link…

a(@click="onScrollyClick") click me

onScrollyClick = e => {
    const OFFSET = 50
    const y = e.target.offsetY - OFFSET
    window.scrollTo({
        top: y,
        left: 0,
        behavior: 'smooth'
    })
}

something like that anyway