Если оператор onScroll не работает Javascript

Я новичок в javascript, и я пытаюсь сделать анимацию с помощью javascript onscroll. Я хочу, чтобы заголовок стал фиксированным, а меню мессенджера появлялось внизу страницы при прокрутке. До этого я все делал нормально. Но я также хочу, чтобы окно обмена сообщениями меняло свой цвет, когда я доходил до нижнего колонтитула.

Я думаю, что у меня есть ошибка условия, так как я пытаюсь написать операторы if, которые связаны, и я не смог найти никаких решений.

window.onscroll = function() {scrollFunction()};
function scrollFunction() {
  if (window.innerWidth > 850) {
    if (document.body.scrollTop > headerOffset || document.documentElement.scrollTop > headerOffset) {
       navbar.classList.add('fixed');
       navCont.style.width = ('85%');
       messenger.classList.add('messengerFix');
       logo.style.filter = 'invert(100%)';
       search.style.filter = 'invert(100%)';
       if (document.body.scrollTop === footerOffset || document.documentElement.scrollTop > footerOffset) {
         messenger.style.background = "yellow";
       }
     }
     else {
       navbar.classList.remove('fixed');
       navCont.style.width = ('100%');
       messenger.classList.remove('messengerFix');
       logo.style.filter = 'invert(0)';
       search.style.filter = 'invert(0)';
     }

  }

}

Я ценю любую помощь или любой совет. Спасибо заранее за вашу помощь.