https://github.com/lepixeliste/scroll2
A lightweight smooth scroll module with TypeScript support
https://github.com/lepixeliste/scroll2
javascript reactjs smooth-scrolling sveltejs typescript vuejs
Last synced: 4 months ago
JSON representation
A lightweight smooth scroll module with TypeScript support
- Host: GitHub
- URL: https://github.com/lepixeliste/scroll2
- Owner: lepixeliste
- License: isc
- Created: 2025-02-20T16:13:26.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2025-02-20T16:17:35.000Z (4 months ago)
- Last Synced: 2025-02-20T17:38:27.550Z (4 months ago)
- Topics: javascript, reactjs, smooth-scrolling, sveltejs, typescript, vuejs
- Language: TypeScript
- Homepage:
- Size: 7.81 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# scroll2
A lightweight smooth scroll module with TypeScript support
## Installation
```javascript
npm install @pixeliste/scroll2 --save
```
## How to use
Default use in your main.js
```typescript
import { scrollTo } from '@pixeliste/scroll2'
...
const el = document.getElementById('anchor-1')
scrollTo(el)
...
```
You can pass an optional object for default duration and easing function; offset can be computed to match a fixed header element height for instance
```javascript
...
const el = document.getElementById('anchor-2')
scrollTo(el, { easing: 'linear', duration: 600, offset: 32 })
...
```
## List of available easing functions
By default, the plugin use a ease-in-out cubic function but you can pass one of the following parameters:
- 'linear'
- 'easeInQuad'
- 'easeOutQuad'
- 'easeInOutQuad'
- 'easeInCubic'
- 'easeOutCubic'
- 'easeInOutCubic'
- 'easeInQuart'
- 'easeOutQuart'
- 'easeInOutQuart'
- 'easeInQuint'
- 'easeOutQuint'
- 'easeInOutQuint'
## License
[ISC](https://opensource.org/licenses/ISC)