Básicamente tendrías que trabajar con el evento
scroll
e ir tomando la cantidad de píxeles desplazados verticalmente con la propiedad
scrollY
.
Un ejemplo de esto cuando, por ejemplo, se desplaza unos 150 a más píxeles:
Código Javascript
:
Ver originalwindow.addEventListener("scroll", function(){
if (this.scrollY >= 150){
console.log("Te has desplazado 150 píxeles o más desde la parte superior del documento");
}
}, false);
Acá puedes ver un ejemplo que di en otro tema en el que se requería que un vídeo se reproduzca solo cuando sea visible al bajar con la barra vertical.
Y
aquí puedes ver otro que hice en el que un conjunto de elementos
<div>
se desplazan de izquierda a derecha cuando son visibles luego de desplazarse hasta sus respectivas posiciones con la barra vertical.
Como verás, todo está en trabajar con la propiedad
scrollY
para saber cuánto nos hemos desplazado verticalmente y así realizar determinadas acciones.
Saludos