scroll-info-css

Use css variables to describe the position, speed, direction, and state of the vertical scroll bar.

Install

With NPM:

$ npm install scroll-info-css

With PNPM:

$ pnpm install scroll-info-css

With Yarn:

$ yarn add scroll-info-css

With Bower:

$ bower install scroll-info-css

Usage

HTML:

<link rel="stylesheet" href="/path/to/scroll-info-css/scroll-info.css" />

CSS:

@import '/path/to/scroll-info-css/scroll-info.css';

Via PostCSS and postcss-import:

@import 'scroll-info-css';

Via webpack and css-loader:

import 'scroll-info-css';

variables

- `--scroll-position-normal`  This css variable describes the vertical scroll bar position of the page, with values ranging from 0 to 100.
- `--scroll-position-tardiness` This css variable has a delay relative to --scroll-position-normal.
- `--scroll-speed` (variable declared in body) Describes the speed of the vertical scroll bar.
- `--scroll-direction` (variable declared in body) Describes the orientation of the vertical scroll bar. (scope:(-1|0|1))-1 means move up, 0 means stop moving,1 means move down.
- `--scroll-state` (variable declared in body) Describes the state of the vertical scroll bar. (scope:(0|1))0 means stationary, 1 means moving.