https://github.com/globocom/scrollspy
Scrollspy can be used to bind a callback that will be called when user scrolls to the given element.
https://github.com/globocom/scrollspy
Last synced: 10 months ago
JSON representation
Scrollspy can be used to bind a callback that will be called when user scrolls to the given element.
- Host: GitHub
- URL: https://github.com/globocom/scrollspy
- Owner: globocom
- License: mit
- Created: 2016-11-09T17:09:07.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2019-10-29T13:14:11.000Z (almost 7 years ago)
- Last Synced: 2025-08-18T08:59:55.859Z (12 months ago)
- Language: JavaScript
- Homepage:
- Size: 140 KB
- Stars: 7
- Watchers: 13
- Forks: 6
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Scrollspy
Scrollspy can be used to bind a callback function to be called when the element
reaches its scroll position.
## Setup
Install via npm
```sh
npm install @globocom/scrollspy
```
Or include one of the [browser bundles](dist/) via a script tag:
```html
```
## Options
```js
ScrollSpy.add({
el: DOMElement, // required
callback: Function, // required - A function to be called when the element gets scrolled into the screen
offset: 200, // An offset (in px) to be considered upon scroll calculation
reference: "top" // ["top"|"bottom"] Which side to use as base for position calculation
});
```
## Usage
```js
import * as ScrollSpy from "@globocom/scrollspy";
ScrollSpy.add({
el: document.querySelector(".myDiv"),
callback: function() {
// do something
}
});
ScrollSpy.add({
el: document.querySelector(".myDiv2"),
offset: 0,
callback: function() {
// do something
}
});
ScrollSpy.add({
el: document.querySelector(".myDiv3"),
offset: 40,
reference: "bottom",
callback: function() {
// do something
}
});
```
## Debug
There is also available a debug function that highlights `"scrollspied"` elements:
```js
ScrollSpy.debug();
```
## Contributing
This project utilizes [npm run scripts](https://docs.npmjs.com/misc/scripts). See [package.json](package.json) for available scripts.
## License
Scrollspy is licensed under the [MIT license](LICENSE).