Cambio de la posición de la barra de desplazamiento

Question

¿Es posible cambiar la posición de la barra de desplazamiento cuando el usuario llega a cierto punto desplazándose hacia abajo en una página web? Por ejemplo, una vez que llegue a la mitad de la página, la barra de desplazamiento se moverá automáticamente a la parte superior.

Answer 1

Se puede calcular el porcentaje de la posición actual de la barra de desplazamiento utilizando el evento onscroll, y si alcanza el 50% de la posición de desplazamiento se puede ajustar a la parte superior de la página con la función scrollTo:

window.onload = function() { 
    window.onscroll = function() { 
    var doc = document.body, 
    scrollPosition = doc.scrollTop, 
    pageSize = (doc.scrollHeight - doc.clientHeight), 
    percentageScrolled = Math.floor((scrollPosition/pageSize) * 100); 

    if (percentageScrolled >= 50){ // if the percentage is >= 50, scroll to top 
     window.scrollTo(0,0); 
    } 
    }; 
}; 

Puede consultar mi ejemplo here.

Answer 2

Sí, lo he visto algunas veces. Aquí hay un código JS:

window.scrollBy (0,50)

50 es la cantidad de píxeles que desea desplazarse por.

Answer 3

(window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop) debe darle la posición de desplazamiento actual en casi cualquier navegador.

Answer 4

Las tres funciones de desplazamiento con las que querrá ocuparse son window.scroll(x,y), window.scrollBy(dx,dy) y window.scrollTo(x,y).

Como mencionó David, necesitará la posición de desplazamiento para saber dónde se encuentra y utilizar el evento window.onscroll para disparar este cálculo.