Как докрутить страницу после метода ScrollIntoView?

Question

[sickgang]

Есть 4 блока, при клике на пункт в навигации, нужно прокрутить до блока. Всё работало, но когда я сделал position: sticky, чтобы после того как навигация прокручивалась, она оставалась сверху всегда, и сейчас прокручивается как надо, но шапка закрывает заголовок того блока куда прокрутилась страница.

Как переписать функцию, или что можно добавить чтобы она примерно на 90 пикселей прокручивалась?

openAnchor: function (numberAnchor) {
        event.preventDefault();
        let anchor = this.$refs[`anchor-${numberAnchor}`];
        anchor.scrollIntoView({behavior: "smooth", block: "start"});
      }

Answer 1

[Demonstr66]

Не уверен, как работает sticky, но судя по всему он не считается в основном потоке елементов DOM, поэтому при скролле надо задать offset, пример стыренный со stackOverflow

const id = 'block';
      const yOffset = -50; 
      const element = document.getElementById(id);
      const y = element.getBoundingClientRect().top + window.pageYOffset + yOffset;

      window.scrollTo({top: y, behavior: 'smooth'});

Comments

[sickgang]

Спасибо большое, работает!