聆听页面上的所有滚动事件

Question

背景:

我正在编写一个组件,可以在点击时打开子菜单.我不知道这个组件将放在页面上的位置,或者它将嵌套在可能具有overflow属性集的区域中的距离.

鉴于溢出可能会剪切子菜单,而是将子菜单本身附加到body赋予它绝对位置并通过代码将其链接到原始组件.这可以解决溢出问题.

问题:

但是,如果用户滚动子菜单保持原位,而不是使用其链接组件移动,那么我需要能够收听页面上发生的任何和所有滚动事件,以便我可以适当地重新定位子菜单.

如果有一种简单的方法来收听所有滚动事件,或者如果有另一种更好的方法来做这个组件,我会很感激任何输入.

我和JSFiddle一起玩过并设置了一个沙箱,但我没有取得任何成功,也没有在这个网站或其他任何地方找到答案; 虽然也许我使用的是错误的搜索词,但我无法想象我是第一个有这个问题的人.

编辑

为了解决投票问题,我不会在没有提供代码的情况下帮助调试问题,也不会问一些将来无法帮助的人.我问我怎么会去听某种类型的所有事件而不管可能发生在哪里,我发现它可以全球适用,尽管这可能是主观的.

编辑

$(window).on('scroll', function(){ /**/ }); 不是一个选项,因为它只监听窗口滚动,而不是任何嵌套的滚动.

$('#ex1 #ex2').on('scroll', function(){ /**/ }); 不是一个选项,因为它要求实现代码的人知道页面上可能滚动的任何当前或可能的未来区域.

Answer 1

您应该能够使用第三个参数附加文档级侦听器,true以捕获所有元素上的滚动事件.这是看起来像:

document.addEventListener('scroll', function(e){ }, true);

将true在年底的重要组成部分,它告诉浏览器来捕获调度的事件,即使该事件不正常的泡沫,样改变,焦点和滚动.

这是一个例子:http://jsbin.com/sayejefobe/1/edit？html,js,console,output