0
139
VistasCómo cambiar la posición de mi div en la carga de la página y en el desplazamiento de la página
Tengo un div de barra superior debajo de un elemento que estoy tratando de mostrar cuando la página se vuelve a cargar tiene top:50px y cuando el usuario se desplaza por la página, la posición cambia a top:175px ya que también tengo un encabezado fijo, pero no funciona como se esperaba.
se está comportando así en la carga de la página: 
y tiene que verse así en la carga de la página:
window.onscroll = function () { scrollFunction() }; function scrollFunction() { if (!document.body.scrollTop > 1 || document.documentElement.scrollTop > 1 ) { document.getElementById("bar").style.top = "90px"; }else{ document.getElementById("bar").style.top = "175px"; } }1 Respuestas
Responde la pregunta0
En primer lugar, su declaración if siempre es verdadera porque creo que document.body.scrollTop siempre es 0 (Corríjame si me equivoco) document.body.scrollTop Firefox devuelve 0: SOLO JS . Simplemente use document.documentElement.scrollTop solo:
if (!document.documentElement.scrollTop) { // Page load document.getElementById("bar").style.top = "90px"; }else{ // user scrolled document.getElementById("bar").style.top = "175px"; } En segundo lugar, me pregunto por qué desea que su barra esté más baja cuando el usuario se desplazó que cuando la página se cargó por primera vez. Si desea que su barra esté siempre en la página debajo de su encabezado, le sugiero que use css position: sticky; top: *your header height in px*