Такая проблема, не срабатывает обработчик прокрутки страницы во время скролла, но если используется навигация якорями, то все отлично работает. Никаких ошибок в консоль не выдает Заранее спасибо
html
<nav>
<a href="#about" >О нас</a>
<a href="#types">Виды работ</a>
<a href="#our">Наши работы</a>
<a href="#contactUs">Контакты</a>
</nav>
...
<span id="top" class="anchor"></span>
...
<spanid="about" class="anchor"></span>
...
<span id="types" class="anchor"></span>
...
<span id="our" class="anchor"></span>
...
<span id="contactUs" class="anchor"></span>
js
const navs = document.querySelectorAll('a[href*="#"]');
const anchors = document.querySelectorAll('.anchor');
data = {
'top': window.pageYOffset + anchors[0].getBoundingClientRect().top,
'about': window.pageYOffset + anchors[1].getBoundingClientRect().top,
'types': window.pageYOffset + anchors[2].getBoundingClientRect().top,
'our': window.pageYOffset + anchors[3].getBoundingClientRect().top,
'contactUs': window.pageYOffset + anchors[4].getBoundingClientRect().top
}
// Функция, не работающая при прокрутке
heightCheck = (data) => {
anchors.forEach((el, i) => {
if (pageYOffset == data[el.id]){
console.log(el.id);
for (let e of navs){
e.classList.remove('active');
}
navs[i].classList.add('active');
}
})
}
// Перемещение по якорям - работает
for (let nav of navs) {
nav.addEventListener('click', (e) => {
for (let el of navs){
el.classList.remove('active');
}
e.preventDefault();
const blockID = nav.getAttribute('href').substr(1);
document.getElementById(blockID).scrollIntoView({
behavior: 'smooth',
block: 'start'
});
nav.classList.add('active');
});
}
window.addEventListener('scroll', () => {
heightCheck(data);
})