1.0.2 • Published 10 months ago

@a11y-ngx/document-scroll v1.0.2

Weekly downloads
-
License
MIT
Repository
-
Last release
10 months ago

Document Scroll

A simple document scroll listener singleton service.

This library was generated with Angular CLI version 12.2.0.

Installation

  1. Install npm package:

    npm install @a11y-ngx/document-scroll --save

  2. Import DocumentScrollService into your typescript file:

import { DocumentScrollService } from '@a11y-ngx/document-scroll';

constructor(private documentScroll: DocumentScrollService) {}

Use

Subscribe to the service's event which will return an object of type DocumentScroll containing the document's x & y scroll position.

import { DocumentScrollService, DocumentScroll } from '@a11y-ngx/document-scroll';
import { debounceTime } from 'rxjs/operators';
...
@Directive({ selector: '[...]' })
export class MyDirective implements OnDestroy {
    private readonly destroy$: Subject<void> = new Subject<void>();

    constructor(
        private documentScroll: DocumentScrollService
    ) {
        this.documentScroll.event
            .pipe(debounceTime(100), takeUntil(this.destroy$))
            .subscribe((scroll: DocumentScroll) => this.stickyHeader(scroll));
    }

    stickyHeader(scroll: DocumentScroll): void {
        const documentX: scroll.x;
        const documentY: scroll.y;
        ...
    }

    ngOnDestroy(): void {
        this.destroy$.next();
        this.destroy$.complete();
    }
}
1.0.2

10 months ago

1.0.1

1 year ago

1.0.0

3 years ago