Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

216
Vistas
¿Cómo mantengo la posición de desplazamiento cuando regreso a una página usando la carga diferida?

En realidad, la pregunta es muy clara, como se ve en el título. La parte que quiero agregar es esta, al igual que en Twitter, cuando bajo la página y luego ingreso un perfil de usuario o detalle de publicación y vuelvo a la página anterior presionando el botón Atrás en el navegador, la página se abre donde la dejé. fuera, a pesar de ser perezoso. ¿Cómo puedo lograr esto con Django. No sé si importa, pero Vue se usa como cdn en mi proyecto.

Me gustaría hablar de un ejemplo sobre el tema. En los navegadores Safari y Chrome en una computadora con macOS, cuando se presiona el botón Atrás en el navegador, se lleva a cabo exactamente el evento que quiero. Vuelve como si la página anterior estuviera en caché, pero en equipos con Windows o Linux, cuando se presiona el botón Atrás del navegador, se vuelve a la página anterior solicitándola nuevamente.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Si está utilizando vistas para representar toda su página, no puedo ver ninguna forma sencilla que haga que el navegador se desplace en el botón Atrás.

En el caso de las plantillas HTML/CSS/JavaScript, tiene dos opciones: confiar completamente en el navegador para administrar el desplazamiento por usted (funcionará cuando el navegador almacene en caché la página).

O puede agregar un script simple que almacene rutas anteriores y actuales en el almacenamiento local y verifique el desplazamiento en la carga de la página:

 const json = localStorage.getItem("routes"); const currentPath = window.location.pathname; let newPrevious = null; if(json) { const routes = JSON.parse(json); const isPrevious = routes.previous != null && routes.previous.path === currentPath; if(isPrevious){ const { x, y } = routes.previous; window.scrollTo(x,y); } //Our new previous route is the old current newPrevious = routes.current; } //Now we update the current route. const newRoutes = { current: { x: 0, y: 0, path: currentPath }, previous: newPrevious } localStorage.setItem("routes", JSON.stringify(newRoutes));

Incluya el script anterior al cargar cada página. Ahora agregamos un oyente antes de descargar donde agregamos la última posición de desplazamiento.

 const x = window.pageXOffset ?? document.documentElement.scrollLeft ?? document.body.scrollLeft ?? 0; const y = window.pageYOffset ?? document.documentElement.scrollTop ?? document.body.scrollTop ?? 0; let routes = JSON.parse(localStorage.getItem("routes")); routes = { ...routes, current: { ...routes.current, x, y } }; localStorage.setItem("routes", JSON.stringify(routes));

Solo tenga en cuenta que esto forzará el desplazamiento incluso cuando tenga un enlace en su página que redirija a la anterior.

Adición : en caso de que esté pensando en usar una biblioteca frontend como Vue con el enrutador Vue, puede olvidarse de administrar esto manualmente y simplemente usar <router-link> para su redirección en su sitio web y el desplazamiento se administrará automáticamente. Puede verificar esta función aquí en los documentos . Creo que ese es el caso de Twitter, puedes ver aquí que están usando React native for web .

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda