sticky

a sticky lib to simulate stickily positioned element.

Features

+ typescript features & vanilla js
+ use CSS sticky firstly
+ support ie9+
+ only support sticky top

Installing

Using npm:

``
$ npm install @autots/sticky -S
`

Using yarn:

`
$ yarn add @autots/sticky
`

Example

$3

`



`

Note: When the host browser doesn't support css position: sticky, the lib will fall back to use scroll event on window object, and set some css properties to his fisrtElementChild.

$3

`
import Sticky from '@autots/sticky';

// 1. The simplest way
new Sticky('#demo');

// 2. use config
new Sticky('#demo', {
top: 10,
zIndex: 100
})
`

$3

`



`

Config

| Name | Type | Default | Optional | Description |
|:-----------:|:---------------:|:----------:|:-------:|:-----------------------|
| mode | 'sticky' or 'affix' | 'sticky' | true | normal affix（fixed） mode or new sticky feature ｜
| scrollRefer | string \| HTMLElement \| Document \| Window | window | true | scroll container |
| offsetParent | string | null | true | offset parent el ｜
| top | number | 0 | true | CSS top (px) property |
| style | object | {} | true | CSS property |
| holderStyle | object | {} | true | CSS property for the Target Placeholder Element |
| throttle | boolean | false | true | throttle feature when use scroll event(assigned when encounter special cases) |

scrollRefer & offsetParent must have a non-static position.

Todo

+ support config direction`