How to do Smooth Scroll in Angular-Material theme?

Question

I am starting a new project and using Angular Material with AngularJS. I am having trouble to make smooth scrolling work. I am using this smooth scroll library: https://github.com/oblador/angular-scroll

I also try this one: https://github.com/d-oliveros/ngSmoothScroll But none of them work. I make a codepen to demo the problem here:

http://codepen.io/hughred22/pen/XmRpOG/

As you see in my Codepen, if I comment out

document.getElementById('bottom').scrollIntoView(true);

To show scrollIntoView work and it scroll to the div. But smooth scroll won't work for some reason. Please help!

Harris Konstantourakis · Accepted Answer · 2015-10-06 14:48:37Z

2

You should use the proper container to initiate scrolling. Check a fixed fork of your codepen here http://codepen.io/harconst/pen/qOmPVo

Notice that in my codepen, the container is not the whole document anymore.

var someElement = angular.element(document.getElementById('bottom'));
var container   = angular.element(document.getElementById('container'));    
container.scrollTo(someElement,0,1000);

edited Oct 6, 2015 at 14:48

answered Oct 6, 2015 at 14:38

Harris Konstantourakis

2393 silver badges3 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to do Smooth Scroll in Angular-Material theme?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related