Old Guides - You are viewing the guides for Ember v1.10.0. VIEW v3.6.0
Edit Page

Resetting scroll on route changes


Problem

The page scroller keeps in the same position when you go from one page to another. For instance, if you scroll down a long list of displayed elements on a page and then you navigate to another page with another long list of elements, you should be able to notice that scroll position is not being reset.

Solution

Add the following mixin to the affected Routes:

App.ResetScroll = Ember.Mixin.create({
  activate: function() {
    this._super();
    window.scrollTo(0,0);
  }
});

Only if you need do something on the activate method you must call this._super() at the beginning:

App.IndexRoute = Ember.Route.extend(App.ResetScroll, {
  //I need to do other things with activate
  activate: function() {
    this._super.apply(this, arguments); // Call super at the beginning
    // Your stuff
  }
});

Example

Ember Starter Kit