https://github.com/dilane3/smoothscroll-js
A simple smooth scroll library for JavaScript.
https://github.com/dilane3/smoothscroll-js
Last synced: 10 months ago
JSON representation
A simple smooth scroll library for JavaScript.
- Host: GitHub
- URL: https://github.com/dilane3/smoothscroll-js
- Owner: dilane3
- Created: 2022-09-01T05:01:00.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2022-09-01T05:22:01.000Z (almost 4 years ago)
- Last Synced: 2025-02-02T20:19:09.916Z (over 1 year ago)
- Language: JavaScript
- Size: 5.86 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Smoothscroll-js
A simple smooth scroll library for JavaScript.
## Advantages
* Easy to use
* Lightweight
* Fast
* Cross-browser
* Customizable
## Installation
```bash
npm install @dilane3/smoothscroll-js
```
or
```bash
yarn add @dilane3/smoothscroll-js
```
## Usage
Genarally, you can use the library like this.
```jsx
import SmoothScroll from '@dilane3/smoothscroll-js';
```
Then you can use it in your application:
```jsx
// Wrapper element for smooth scrolling
const wrapper = document.querySelector('.wrapper');
// Smooth scroll option
const options = {
direction: 'v',
smooth: 0.08
}
// Initialization
new SmoothScroll(wrapper, options);
```
**For React App**
Especialy for React App, you can use the library like this.
```jsx
import SmoothScroll from '@dilane3/smoothscroll-js';
```
Then you can use it in your application:
```jsx
// Create a component for smooth scrolling
const App = () => {
const wrapper = useRef(null);
useEffect(() => {
const options = {
direction: 'v',
smooth: 0.08
}
new SmoothScroll(wrapper.current, options);
} , []);
return (
Hello World
This is a paragraph
);
}
```
## Parameters
The constructor of SmoothScroll accepts the following parameters.
| Parameter | Type | Description |
| --------- | ----------- | ----------- |
| wrapper | HTMLElement | The wrapper element for smooth scrolling |
| options | Object | The options for smooth scrolling |
### Options parameters
| Parameter | Type | Description |
| --------- | --------------- | ----------- |
| direction | 'v' or 'v-' | The direction of smooth scrolling |
| smooth | Number | The smooth value of smooth scrolling |
## License
ISC License
Copyright (c) 2022 Dilane3