Cómo capturar todos los eventos de desplazamiento en una página sin adjuntar un controlador de desplazamiento de desplazamiento a cada contenedor único
Considere la siguiente página web:
<html>
<body onscroll="alert('body scroll event')">
<div style='width:200px;height:200px;overflow:auto' onscroll="alert('div scroll event')">
<div style='height:400px'>
</div>
</div>
</body>
</html>
Este html crea un div con una barra de desplazamiento. Si mueve la barra de desplazamiento, se activa el evento "onscroll" en el elemento div. Sin embargo, el evento "onscroll" en el cuerpo NO se dispara. Esto se espera, ya que el W3C establece que los eventos de desplazamiento de elementos no "burbujean".
Sin embargo, estoy desarrollando un marco web del lado del cliente que necesita saber cada vez que se desplaza una barra de desplazamiento en CUALQUIER elemento de la página. Esto sería fácil de hacer si "onscroll" burbujeara, pero desafortunadamente no es así. ¿Hay alguna otra manera de detectar eventos de onscroll en una página completa? (En este momento me estoy centrando principalmente en Webkit, por lo que una solución específica para Webkit estaría bien ...)
Aquí hay algunas cosas que he intentado: 1. Capturar DOMAttrModified (no parece activarse para mover las barras de desplazamiento). 2. Usar los Observadores DOM (tampoco parece activarse para las barras de desplazamiento) 3. Cambiar el tipo de evento "onscroll" burbujear (parece no ser posible)
Parece que la ÚNICA forma de capturar eventos de onscroll a nivel mundial es adjuntar un evento de onscroll a CADA elemento que pueda desplazarse, lo que es muy feo y va a perjudicar el rendimiento de mi marco.
¿Alguien sabe de una manera mejor?
¡Gracias por adelantado!