IntersectionObserver模糊元素在非焦点上

Question

最近，我一直在为我的一个朋友开发一个带有图像网格的项目。该网站背后的想法是，当一行中的图像成为焦点时，它会弹出，剩下的将恢复到原来的大小。

经过一些研究后，我找到了适用于JavaScript的IntersectionObserver API以及以下示例：http://codepen.io/pawelgrzybek/pen/YWqWXJ我修改了代码以将阈值更改为

let options = {
  threshold: [1.0]
};

但这些只是个人修改，我遇到的问题是当我向下滚动到使用可见类聚焦的下一个元素但前面的元素仍然保持焦点。我不确定这样做的最好方法。

我找到了examples并且能够注意到以下代码：

function updateStatus(visiblity) {
      console.log(visiblity);
      const status = document.querySelector('.status');
      status.textContent = visiblity;
      status.className = 'status status--' + visiblity;
    }

但这仅适用于Simple Example中的顶栏。我需要一些帮助来解决这个问题，拜托并感谢大家！