1.0.4 • Published 7 years ago
angular-smooth-scroller v1.0.4
angularSmoothScroller
This is an angular service that smoothly scrolls the page or the chosen scrollable element to a given target element vertical position.
Installation
Install it with npm:
npm install angular-smooth-scrollerInstall it with bower:
bower install angular-smooth-scrollerUsage
Register the
angularSmoothScrollermodule into your app's module.angular.module( 'myApp', [ 'angularSmoothScroller' ] );Inject the
angularSmoothScrollerservice into your controller:myApp.controller( 'AppController', function ( angularSmoothScroller ) { // your code here } );Set the scrollable element (default is
window):angularSmoothScroller.setScrollableContainer( 'content' );Scroll the scrollable container to the target element:
angularSmoothScroller.scrollTo( 'targetId', 1000, 100 );
Methods
angularSmoothScroller.setScrollableContainer(elementSelector)
| Param | Type | Description | Default Value | Options |
|---|---|---|---|---|
| elementSelector | string | HTMLElement | The element selector or object | window | -- |
angularSmoothScroller.scrollTo(el, speed, offset, easingFn)
| Param | Type | Description | Default Value | Options |
|---|---|---|---|---|
| el | string | HTMLElement | The element selector or object | window | -- |
| speed | number | The scrolling speed (in ms) | 2000 | -- |
| offset | number | The distance between the top of the viewport and the target element | 0 | -- |
| easingFn | string | The easing function name. | easeInOutQuint | easeOutSine, easeInOutSine and easeInOutQuint |
@returns Promise
NOTE: The scrollable element must have a vertical scrollbar. Only vertical scrolling is supported ATM.