Position Indicator


About

Minimal VanillaJS code to know the scroll position of the page with no external dependencies.

A position indicator that updates on:

- scroll
- resize
- body height change.

It has been tested on

- Phones (iOS, Android)
- Tablets (iPadOS, Android)
- Laptops (Mac, Windows)
- Modern browsers

It updates when the devices rotates and if the height changes on interaction.

Browser Support

| !Chrome | !Safari | !Firefox |
| ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------- |
| 60+ | 12+ | 60+ |

Demo

Codesandbox React		View	Edit
Codesandbox Vue		View	Edit
Codesandbox Angular		View	Edit
Codepen Vue		View	Edit

Installation

This library is published in the NPM registry and can be installed using any compatible package manager.

``sh
yarn add position-indicator

For npm, use the command below.


npm install position-indicator --save
`

$3

`js
import { createPositionIndicator } from 'position-indicator'

let myOnInitCallback = (data) => {}
let myOnUpdateCallback = (data) => {}

// where data is:
let data = {
position / value between 0 and 1 /,
prevPosition / value between 0 and 1 /,
hasUpdated / if position is different from previous event /,
hasScroll / true or false /,
eventType / scroll, resize, heightChange or init /,
eventDate / Date.now() /,
}

let positionIndicator = createPositionIndicator({
onInit: myOnInitCallback,
onUpdate: myOnUpdateCallback,
useResizeListener: true, // optional: default true
useResizeObserver: true, // optional: default true
})

positionIndicator.init()

// Then later when not used anymore
positionIndicator.destroy()
`

$3

This module has an UMD bundle available through JSDelivr and Unpkg CDNs.

`html







``

Explore the dist files

https://unpkg.com/position-indicator/

Documentation

Documentation generated from source files by Typedoc.

License

Released under MIT License.