Created by Arnaud BRETON
bower install angular-smoothscrollHome Demo Download GitHub
AngularJS directives to get a smooth scroll effect (like this: http://css-tricks.com/examples/SmoothPageScroll/). Pure vanilla JS and jQuery versions.
How to use it?
Here is a demo Plunkr: http://plnkr.co/edit/rD0Zgi6rg3Spc2XeVrZf?p=preview
Build your own copy
- Build Coffeescript
- Copy generated JS in .tmp folder and include it
Get the last version
Copy the last version from the
Via Twitter Bower (https://github.com/bower/bower)
bower install angular-smoothscroll in your project
Add the dependency to your app
Declare an AngularJS module with a dependency:
Vanilla JS (to improve, too fast)
Just declare an HTML link element which will start scroll, add the
smooth-scroll directive and pass the target ID:
<a smooth-scroll target="target">Scroll to Target</a>
Declare an HTML link element which will start scroll, add the
smooth-scroll-jquery directive and pass the target ID:
<a smooth-scroll-jquery target="target">Scroll to Target</a>. No target means scroll to top.
You can declare the speed (default is 500):
<a smooth-scroll-jquery target="target" speed="1000">Scroll to Target</a>
With both versions, you can declare the offset (default is 100):
<a smooth-scroll[-jquery] target="target" offset="30">Scroll to Target</a>
How to contribute?
- Clone this repo
- Make your changes
- Test them:
- Open a pull-request
- Vanilla JS implementation which is not working very well
- Make the Angular JS unit tests pass (cf. http://stackoverflow.com/questions/16929046/effectively-unit-test-an-angularjs-directive-which-is-manipulating-the-dom?noredirect=1#comment24448390_16929046)
Powered by AngularJS (http://angularjs.org), Yeoman (http://yeoman.io), Grunt (http://gruntjs.com) and Karma (http://karma-runner.github.io/0.8/index.html)