Javascript 高度大于视图的元素上的IntersectionObserver位置

我正在寻找一种方式，以显示用户在菜单中，他在页面上的位置。 每个菜单项都有指向另一个元素和IntersectionObserver的锚定链接，该服务器设置项目的背景宽度，以及项目是否从底部或顶部显示（背景上的左-右）

let选项={
root:null，
rootMargin:“0px”，
阈值：[]
}
for（设i=0；i{
常量项=条目[0]
if（项目isIntersecting）{
让visiblePct=数学楼层（item.intersectionRatio*100）
此.pageProgressOpt.width=
（此.$el.getBoundingClientRect（）.width/100）*可见PCT
此.pageProgressOpt.align=
item.boundingClientRect.top<0？“右”：“左”
}否则{
this.pageProgressOpt.width=0
}
}，选项）

但当元素高度大于可见窗口的高度，视图处于元素回调的中间时，则不发射。这有点明显，因为已达到阈值1.0。但我正在寻找继续观察元素的方法。 我本想在发生这种情况时将其附在卷轴上，但无法确定是否发生了这种情况

我应该只使用scroll事件还是其他解决方法

---

//编辑：这是我正在做的视频

Hi@zajca，我知道这个问题很老了，但最近我遇到了一个类似的问题。看起来这是交叉口观察者的预期行为。看看GitHub上的这个问题：有一个提议的改变将允许实现您想要的，但它还没有实现。

let options = {
  root: null,
  rootMargin: "0px",
  threshold: []
}
for (let i = 0; i <= 1.0; i += 0.01) {
  options.threshold.push(i)
}
this.observer = new IntersectionObserver(entries => {
  const item = entries[0]
  if (item.isIntersecting) {
    let visiblePct = Math.floor(item.intersectionRatio * 100)
    this.pageProgressOpt.width =
      (this.$el.getBoundingClientRect().width / 100) * visiblePct
    this.pageProgressOpt.align =
      item.boundingClientRect.top < 0 ? "right" : "left"
  } else {
    this.pageProgressOpt.width = 0
  }
}, options)