Best practice for resetting scroll position between pages?

Question

Thus, even the Polymer website has this problem. This is the problem of the SPA world.

Repro: go to http://www.polymer-project.org/docs/elements/core-elements.html , click on for example. core-ajax on the left and scroll down to the middle, then go to core-xhr. Pay attention to the scroll position.

What are some best practices, given that I: a) want to avoid behaviors like the one above, but also b) want to keep the scroll position when I use the back arrow to go to the page that I already had? It would be nice if the embedded pages had built-in support.

Answer 1

This may work as a workaround. You can use the fire event in the polymer as soon as something fires the listen event for a call and makes the page scroll up . At least that solved my problem with transitioning kernel-animated pages: slide-from-right.

Polymer

this.fire('scroll-top')

Index.html

 document.addEventListener('scroll-top'){ // Access the main core-header-panel var scaffold = document.querySelector('core-scaffold'); var scrollArea = scaffold.shadowRoot.querySelector('core-header-panel'); scrollArea.scroller.scrollTop = 0; // Scroll to top } } 

Answer 2

update 01/01/2018

Polymer now has a nice element for this:

iron-scroll-threshold