Как убрать max-Height с акардиона при scroll?

Question

[akademik33]

есть аккардион который Должен при открытии одного закрывать другой. При первом нажатии открыть при втором закрыть. Это все реализованно если у вас есть возможность его сделать более правильным и красывым. Буду признателен.
Вопрос в другом. Как при скроле закрыть акардион если он открыт(

var acc = document.getElementsByClassName("valuesAccardionTittle");
for (var i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click", accordion);
}

function accordion() {
  for(var i = 0; i < acc.length; i++) {
    acc[i].classList.remove("active");
    acc[i].nextElementSibling.style.maxHeight = null;
  }
  this.classList.add("active");
  var panel = this.nextElementSibling;
  panel.style.maxHeight = panel.scrollHeight + 'px';
  for (i = 0; i < acc.length; i++) {
    acc[i].addEventListener("click", function() {
      this.classList.toggle("active");
      var panel = this.nextElementSibling;
      if (panel.style.maxHeight) {
        panel.style.maxHeight = null;
      } else {
        panel.style.maxHeight = panel.scrollHeight + "px";
      } 
    });
  }
}

Comments

[Антон Литвиненко]

задавать обьекту поведение, которого не ожидает пользователь противоречит принципам UX

[akademik33]

Антон Литвиненко, Спасибо но виденье дизайнера, логике не поддаеться)

[Сергей delphinpro]

akademik33, слушать событие scroll -> закрывать аккордион.

Answer 1

[ArtGMlg]

Чтобы у вас была возможность изменять свойства ваших элементов при прокрутке страницы, используйте встроенный event listener

window.addEventListener('scroll', function() {
    // здесь обращаетесь к каждому элементу из массива acc и изменяете его высоту
});