Package detail

@eunsatio/ngx-smooth-scroll

Seemspyo377MIT1.0.6

Provide simple & configurable & cubic-bezier support smooth scroll for Angular 7+

angular, javascript, typescript, smooth, scroll, smooth scroll, smoothscroll, scrolling, scroll to, wheel, keyboard, bezier, cubic, cubicbezier, ngx, ng

readme

Agular Smooth Scroll

Provide simple, configurable, cubic-bezier support smooth scroll for Angular 7+

Contents

Purpose

Javascript Browser APIs has scrollTo and scrollIntoView method. Which allows us to manipulate browser native scroll behavior easily. But some browser does not supports behavior: 'smooth' option. Thus, this methods doesn't have options for duration nor timing-function. And we have to seek for workaround to know when this behavior going to ends. This package is configurable, compatible, easy to use, and uses rxjs.Observable to notify the subscribers when behavior ends.

Installation

NPM

npm install @eunsatio/ngx-smooth-scroll

Issues

If you found any errors or suggestion to this library, please open an issue.

Author

SeemsPyo(@eunsatio) Github, Homepage

changelog

1.0.5 Add peerDependencies

1.0.4 Update README

1.0.3 Update README

1.0.2 more specific error message

1.0.1 downgrade to typescript@3.6.5

1.0.0

@Deprecated: NgxSmoothScrollWheelDirective
@Deprecated: NgxSmoothScrollKeyboardDirective
Change: child-selector -> childSelector

Check new feature at Documentaion

0.3.1-beta fix wrong documentation

childSelector: not childSelector should use child-selector

0.3.0-beta Add methods & properties to each directive

NgxSmoothScrollWheelDirective.containerEl: HTMLElement, container element.
NgxSmoothScrollWheelDirective.children: HTMLElement[], pure array of child elements.
NgxSmoothScrollWheelDirective.scrollTo: (destination, options) => Observable<{ x: number; y: number; }>

Scroll to given destination.
- destination: object, { x: number; y: number; }, required
- options: NgxSmoothScrollOption, see more here
NgxSmoothScrollWheelDirective.scrollToChild: (childEl, options) => Observable<{ x: number; y: number; }>

Scroll to given child element
- childEl: HTMLElement, required
- options: NgxSmoothScrollOption, see more here
NgxSmoothScrollWheelDirective.scrollToIndex: (index, options) => Observable<{ x: number; y: number; }>

Scroll to given child index. childSelector must be set.
- index: number, index of child element, required
- options: NgxSmoothScrollOption, see more here
NgxSmoothScrollKeyboardDirective.containerEl: HTMLElement, container element.
NgxSmoothScrollKeyboardDirective.children: HTMLElement[], pure array of child elements.
NgxSmoothScrollKeyboardDirective.scrollTo: (destination, options) => Observable<{ x: number; y: number; }>

Scroll to given destination.
- destination: object, { x: number; y: number; }, required
- options: NgxSmoothScrollOption, see more here
NgxSmoothScrollKeyboardDirective.scrollToChild: (childEl, options) => Observable<{ x: number; y: number; }>

Scroll to given child element
- childEl: HTMLElement, required
- options: NgxSmoothScrollOption, see more here
NgxSmoothScrollKeyboardDirective.scrollToIndex: (index, options) => Observable<{ x: number; y: number; }>

Scroll to given child index. childSelector must be set.
- index: number, index of child element, required
- options: NgxSmoothScrollOption, see more here

0.2.3-beta fix interrupt method

0.2.2-beta hot fix for child selector

0.2.1-beta Add directives to exports

0.2.0-beta Add interrupt method to directives & Fix bug

NgxSmoothScrollWheelDirective.interrupt: () => boolean
- @return: boolean, whether behavior interrupted successfully.
NgxSmoothScrollKeyboardDirective.interrupt: () => boolean
- @return: boolean, whether behavior interrupted successfully.
Fix bug: NgxSmoothScroll.interrupt not worked propery.
0.1.2-beta Update README

0.1.1-beta Update README