¿Cómo se puede usar jQuery para medir qué tan lejos se ha desplazado el usuario?

Question

Necesito cambiar el estilo de un elemento después de que el usuario se haya desplazado hacia abajo más allá de una cierta cantidad de píxeles, y luego volver a cambiarlo una vez que el usuario se haya desplazado hacia atrás. Ya estoy usando jQuery, así que me gustaría usar jQuery si es posible. ¿Alguien puede dar un ejemplo en el que agregue un nombre de clase a un div una vez que el usuario haya desplazado más de 200 píxeles y luego elimine el nombre de clase una vez que el usuario se haya desplazado hacia atrás a menos de 200 píxeles?

Answer 1

Ver scrollTop, scrollLeft y Events/Scroll.

Ejemplo:

$('div#something').scroll(function() { 
    if ($(this).scrollTop() > 200) { 
     $(this).addClass('foo'); 
    } else { 
     $(this).removeClass('foo'); 
    } 
}); 

Answer 2

Esto no está funcionando, ya que los teléfonos móviles no aceptan .scrollTop() ya que utilizan una ventana en su lugar. Por lo tanto, .scrollTop() siempre será 0 en los teléfonos móviles. Todavía estoy buscando la solución adecuada para esto, pero no he encontrado ninguna.