Скрытие заголовка не работает - Django ecommerce

У меня есть заголовок, который я хочу скрыть при прокрутке вниз. Заголовок находится в моей папке templates в Django, имя файла base.html - см. код ниже:

Сценарий, которым я пытался скрыть заголовок, выглядит следующим образом (он также находится выше в первом фрагменте, которым я поделился):

<script type="text/javascript">
        var lastScrollTop;
        navbar = document.getElementsByClassName('fixed-top');
        window.addEventListener('scroll',function(){
        var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
        if(scrollTop > lastScrollTop){
        navbar.style.top='-80px';
        }
        else{
        navbar.style.top='0';
        }
        lastScrollTop = scrollTop;
        });
    </script>

Я получаю следующую ошибку: Uncaught TypeError: Cannot set properties of undefined (setting 'top')

Может ли кто-нибудь сказать мне, что я упускаю, пожалуйста? Заранее большое спасибо!

getElementsByClassName возвращает коллекцию элементов, а не единственный элемент. Чтобы получить доступ к каждому отдельному элементу, необходимо обойти эту коллекцию:

  let elements = document.getElementsByClassName('fixed-top');
  for( let i = 0; i < elements.length; i++ )
    elements[i].style.top = 0;
Вернуться на верх