Якорные ссылки - скролл - JS
Коллеги, всем добрый день.
На сайте реализован скролл по якорным ссылкам. Метод нашел здесь же, на StackOverflow. Все отлично работает. Но есть НО. У меня на странице header имеет свойство fixed. Когда срабатывает скролл, часть блока, до которого он происходит, оказывается под header. Помогите пожалуйста с решением. Думаю вычислять высоту header и добавлять ее к верхней Y координате блока, к которому совершается скрол.
Спасибо
<aside class="service__aside aside">
<nav class="aside__nav">
<ol class="aside__nav-numlist">
<li class="aside__nav-numitem">
<a class="aside__nav-numlink" href="#"></a>
</li>
<li class="aside__nav-numitem">
<a class="aside__nav-numlink" href="#"></a>
</li>
<li class="aside__nav-numitem">
<a class="aside__nav-numlink" href="#"></a>
<ol class="aside__nav-numlist aside__inner-nav">
<li class="aside__nav-numitem">
<a class="aside__nav-numlink" href="#"></a>
</li>
<li class="aside__nav-numitem">
<a class="aside__nav-numlink" href="#"></a>
</li>
<li class="aside__nav-numitem">
<a class="aside__nav-numlink" href="#"></a>
</li>
</ol>
</li>
</ol>
</nav>
</aside>
document.addEventListener('DOMContentLoaded', function () {
let anchors = document.querySelectorAll('a[href*="#"]');
for (let anchor of anchors) {
anchor.addEventListener('click', function (e) {
e.preventDefault();
let blockID = anchor.getAttribute('href').substr(1);
document.getElementById(blockID).scrollIntoView({
behavior: 'smooth',
block: 'start'
});
});
};
});