scroll-sync
Version:
Scroll synchronization (`scroll-sync`), which associates multiple elements with scroll properties (`overflow: scroll`). When a scroll event occurs in one of the elements, the scroll effect is mapped to all the elements associated with it. To achieve synch
51 lines (37 loc) • 2.5 kB
Markdown
Scroll synchronization (`scroll-sync`), which associates multiple elements with scroll properties (`overflow: scroll`). When a scroll event occurs in one of the elements, the scroll effect is mapped to all the elements associated with it. To achieve synchronization purposes. `scroll-sync` supports fixed synchronization (`px`) and relative synchronization (`%`).
## INSTALL
```shell
npm install -S scroll-sync
# OR
yarn add scroll-sync
```
## USAGE
```js
import ScrollSync from 'scroll-sync'
const ss = new ScrollSync({
disabled: false, // [Boolean] Default value, allow to be empty.
relative: true, // [Boolean] Default value, allow to be empty.
doms: document.querySelectorAll('.scroll-container') // [Array] These elements must set scroll attributes.
})
// do sth....
// You can also find another opportunity to set related elements after instantiating the object.
ss.set(document.querySelectorAll('.scroll-container'))
// Or add or delete.
// ss.add([elements])
// ss.remove([elements])
// You can also actively clear the listener event and clear the cache.
// ss.clear()
```
[](https://kiccer.github.io/scroll-sync/)
This library is an additional product obtained from my actual work. Because I don’t use it frequently, I will not actively add any new functions except for necessary problem fixes. If you have any new function requirements, please Leave me a message in [`ISSUES`](https://github.com/kiccer/scroll-sync/issues) and I will help you achieve it in my spare time.
<!-- 这个库是我实际工作中得到的额外产物，因为我自身使用它的频率并不高，所以除了必要的问题修复外我不会积极增加任何新的功能，如果你有任何新的功能需求，请在 `ISSUES` 中给我留言，我会在闲暇时间帮助你实现它。 -->