粘性导航不适用于较小的屏幕尺寸

Question

我目前正在实现 HTML 和 CSS 的设计。 对于响应性，我正在实现媒体查询。 我有一个粘性导航，它变成了一个低于 850 像素屏幕尺寸的下拉菜单。 粘性导航工作正常（使用交叉点观察器实现，当英雄部分不在视线范围内时触发）。 但是，对于较小的屏幕，当我将其更改为下拉菜单时，它会在第三部分触发，甚至将我带回第二部分。 有人可以帮忙吗？

// sticky navigation implementation
const observer = new IntersectionObserver(
  (entries) => {
    if (!entries[0].isIntersecting) {
      document.body.classList.add('sticky');
    } else {
      document.body.classList.remove('sticky');
    }
  },
  {
    root: null,
    threshold: 0.05,
  }
);
observer.observe(sectionHero);