Aguarde...

17 de julho de 2020

Memorizar a posição da rolagem entre as cargas de página

Memorizar a posição da rolagem entre as cargas de página

Hakim El Hattab twittou um pequeno aprimoramento UX muito bom para um site estático que inclui uma barra lateral de navegação rolável.https://twitter.com/hakimel/status/1262337065670316033

O truque é lançar a posição de rolagem para a localStoragedireita antes de a página sair e, quando carregada, pegue esse valor e vá até ele. Vou digitá-lo novamente a partir do tweet …

let sidebar = document.querySelector(".sidebar");

let top = localStorage.getItem("sidebar-scroll");
if (top !== null) {
  sidebar.scrollTop = parseInt(top, 10);
}

window.addEventListener("beforeunload", () => {
  localStorage.setItem("sidebar-scroll", sidebar.scrollTop);
});

O que é surpreendente é que você não consegue uma posição de rolagem com flash errado. Eu quero saber porque? Talvez isso tenha a ver com tinta sofisticada que os navegadores estão fazendo agora? Não tenho certeza.

Postado em Blog
Escreva um comentário