我的页脚不会停留在我的主要内容下

footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 50px;
  background-color: #f5f5f5;
}

window.addEventListener('scroll', function() {
  var footer = document.querySelector('footer');
  var mainContent = document.querySelector('.main-content');
  var footerHeight = footer.offsetHeight;
  var mainContentHeight = mainContent.offsetHeight;
  var windowHeight = window.innerHeight;

  if (window.pageYOffset + windowHeight >= mainContent.offsetTop + mainContentHeight) {
    footer.style.position = 'fixed';
    footer.style.bottom = '0';
  } else {
    footer.style.position = 'static';
  }
});