javascript - 在内部 div 中捕获滚动

Question

我想要实现的是这个，想象一下你有一个高大的页面，里面有几个 div。
tall 页面本身是可滚动的，div 也是。

我想实现的是在滚动div到极限时防止滚动整个页面。
现在发生的情况是，当您通过猛烈滚动到达 div 的末尾时，您开始滚动整个页面。我想防止滚动整个页面，因为这是一个私有(private)元素，底部的元素很少被使用。

div 不是动态生成的，因此我可以对所有内容进行硬编码。

如果可能的话，我真的很想避免使用 jQuery，因为在这种情况下这似乎有点矫枉过正。

//编辑: 可以在 http://gnur.nl/demo.html 找到一个小例子。
此演示的预期行为是当您在 bacon div 内滚动时整个页面永远不会滚动。

Answer 1

恐怕这是一场失败的战斗，滚动事件看起来不可取消:

http://www.w3.org/TR/DOM-Level-3-Events/#event-type-scroll

或者可能会绝望地回滚滚动的像素数量:

var lastPos = isNaN(window.pageYOffset) ? 
  document.documentElement.scrollTop :
  window.pageYOffset;

window.onscroll = function(ev){
  var diff = (isNaN(window.pageYOffset) ? 
    document.documentElement.scrollTop : 
    window.pageYOffset) - lastPos;
  window.scrollBy(0, -diff);
};

并在 DIV 上使用 onmouseover 和 onmouseout 来阻止或不阻止它。