Smooth Scrolling for Autoscroll in UI-Router

Question

Is there a way to get the functionality of `ui-router`'s autoscroll with smooth scrolling instead of jumping immediately to that place? Or is there a way to add an eventlistener to all states that's fired when the state is changed in a way that I get access to the ui-view's element?

Accepted Answer

Something like this should work. You might have to tweak the target.offset().top a bit if you have a fixed header or something similar that might mess with the offset.

```
app.config(function ($provide) {
  $provide.decorator('$uiViewScroll', function ($delegate) {
    return function (uiViewElement) {
        $('html,body').animate({
            scrollTop: uiViewElement.offset().top
        }, 500);
    };
  });
});
```

Keep `autoscroll="true"` on your ui-view.

See other answer for credit on the prodiver: Angular ui-router scroll to top, not to ui-view.

Smooth Scrolling for Autoscroll in UI-Router

Solution

Problem

Related problems