如何让父母在孩子之前滚动

Question

我想将父div滚动到底部，然后然后使子div滚动。与正常行为完全相反（子滚动然后是父滚动）

我要摆脱的主要问题是始终保持滚动流畅。如果您看一下jsfiddle，您会看到一种解决方案，该解决方案可以在某个位置启用子滚动条。

此问题是，即使子滚动条可用，也会触发父滚动事件。这意味着滚动停止，并且用户必须先停止滚动一秒钟，然后才能滚动孩子。

如果您非常快地滚动（或滑动）鼠标滚轮，您会看到问题，但非常慢的滚动并不能真正显示出来（因为触发了子滚动事件）

我已经尝试了很多事情，但是我想应该在这里问一下，因为我要深入兔子洞了。

document.querySelector('.parent').addEventListener('scroll', handleScroll)

function handleScroll(e){
  let parent = document.querySelector('.parent')
  let maxScroll = parent.scrollHeight - parent.clientHeight
  if (parent.scrollTop == maxScroll) {
    document.querySelector('.child').style.overflowY = 'auto'
  } else {
    document.querySelector('.child').style.overflowY = 'hidden'
  }
}

http://jsfiddle.net/jgLn784k/22/