Scroll-tracker-component-manager NPM

Description

The ScrollTrackerComponentManager is a Class that tracks whether a component is within your viewport based on your scroll position. It will/can handle the following for you:

Trigger methods such as enterView or leaveView, once you component enters/leaves your viewport.
Update your component with a progress value between 0 and 1. This is the progress of you components visibility.
Enable smooth-scroll if needed

Installation

yarn / npm

yarn add scroll-tracker-component-manager

npm i -S scroll-tracker-component-manager

Online Demo

Checkout the online demo.

Demo

Demo can be found in /example. Install dev dependencies:

  yarn

Run the example:

  yarn dev

Documentation

Detailed documentation and examples are located in the wiki!

Check the wiki!

Building

In order to build scroll-tracker-component-manager, ensure that you have Git and Node.js installed.

Clone a copy of the repo:

git clone https://github.com/riccoarntz/scroll-tracker-component-manager.git

Change to the vue-transition directory:

cd scroll-tracker-component-manager

Install dev dependencies:

yarn

Use one of the following main scripts:

yarn build           # build this project
yarn dev             # run dev-watch mode, serving example/index.html in the browser
yarn generate        # generate all artifacts (compiles ts, webpack, docs and coverage)
yarn test:unit       # run the unit tests
yarn validate        # runs validation scripts, including test, lint and coverage check
yarn lint            # run tslint on this project
yarn doc             # generate typedoc documentation

When installing this module, it adds a pre-push hook, that runs the validate script before committing, so you can be sure that everything checks out.