Якорные ссылки - скролл - 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'
         });
      });
   };
});

Ответы (0 шт):