javascript

Make the scroll down a few pixels on a link anchor type

When we are creating a onepage web with anchor links and sticky headers or fixed type, we can find us with the problem that the head stays above the content we want to show us where is our anchor tag.

To solve this problem we can simply add the following javascript code by modifying the pixels tall having our head (in this case we dropped -100px):

function offsetAnchor() {
if(location.hash.length !== 0) {
window.scrollTo(window.scrollX, window.scrollY - 100);
}
}
window.addEventListener("hashchange", offsetAnchor);
window.setTimeout(offsetAnchor, 1);