Published
- menos de un minuto leyendo
Script para conservar scroll entre cambio de páginas

Antes de empezar, un poco de parloteo.
A principios de 2023, me encontraba haciendo debugging a un proyecto mío hasta que me di cuenta que había descartado una feature (característica del software) por completo.\
La *feature *en cuestión era el conservar el scroll, o desplazamiento, al navegar entre distintas subpáginas de un mismo sitio web. Puedes comprar el funcionamiento de esto en sitios como RateYourMusic. Por supuesto, no todos proyectos deben de contar característica; a cada uno lo suyo. Pero, en mi caso, la experiencia de usuario se veía perjudicada al no poder restaurar el desplazamiento vertical original, ya que el blog en el que trabajaba tenía un scroll que se alargaba considerablemente cuando se añadían nuevos posts.\
Yendo al grano, aquí está el script necesario para que el *scroll *se restaure en la página en que se aplica este código JS, sin importar si se viaja a las subpáginas.
// Pasar posición vertical a int y 0 (o, si hay sessionStorage, la última posición guardada)
const currentY = parseInt(sessionStorage.getItem("currentY")) || 0;
window.addEventListener("load", () => {
window.scrollTo({ left: 0, top: currentY, behavior: "auto" });
// setTimeout(() => window.scroll(0, currentY), 250)
});
// Poner sesson scroll al cambiar de página
window.addEventListener("visibilitychange", () => {
sessionStorage.setItem("currentY", window.scrollY.toString());
});