scrollIntoView（）在Chrome上窃听

Question

我试图实现的效果，我可以从一个div跳转到另一个div ID。基本上我向下滚动div-1并在滚动上触发一个事件并跳转到div-2，反之亦然。我能够在香草JS中实现它。它在Chrome上闪烁，但在其他浏览器上工作顺利（除了爷爷IE）。任何人都知道可能导致它的原因，以及我能得到什么解决方案或替代方案？

document.getElementById("scroll-div1").addEventListener("wheel", myFunction1);

function myFunction1() {
    document.getElementById("scroll-div1").addEventListener('wheel', function(e) {
  if (e.deltaY > 0) {
    document.getElementById("scroll-div2").scrollIntoView();
  }
  else if (e.deltaY < 0) {
       window.scrollTo(0,0);
  }
});
} 

document.getElementById("scroll-div2").addEventListener("wheel", myFunction2);

function myFunction2() {
        document.getElementById("scroll-div2").addEventListener('wheel', function(e) {
  if (e.deltaY > 0) {
    document.getElementById("scroll-div3").scrollIntoView();
  }
  else if (e.deltaY < 0) {
       window.scrollTo(0,0);
  }
});
} 

document.getElementById("scroll-div3").addEventListener("wheel", myFunction3);

function myFunction3() {
        document.getElementById("scroll-div3").addEventListener('wheel', function(e) {
    if (e.deltaY < 0) {
       document.getElementById("scroll-div2").scrollIntoView();
  }
});
} 

<div id="scroll-div1" style="height: 768px; overflow: auto;">
<p>This is div 1</p>
</div>
<div id="scroll-div2" style="height: 768px">
<p>This is div 2</p>
</div>
<div id="scroll-div3" style="height: 768px">
<p>This is div 3</p>
</div>

Answer 1

所以我尝试使用各种方法的jQuery，似乎问题是浏览器支持同步/异步滚动。在这种情况下，Chrome似乎有异步滚动，它滞后于滚动回调。所以现在，在2018年9月，我无法给出我想要的某些效果，并等待将来的一些改进。

参考：https://developer.mozilla.org/en-US/docs/Mozilla/Performance/Scroll-linked_effects