Wrap all your buttons or any component in react-button-slider and it will be horizontally scrollable without any scrollbar
npm
npm i @gunawanedy/react-button-slider
yarn
yarn add @gunawanedy/react-button-slider
import React from 'react';
import ReactButtonSlider from '@gunawanedy/react-button-slider';
const App = () => {
return (
<>
<ReactButtonSlider>
{/*you can add styling for your button using css*/}
<button>Category 1</button>
<button>Category 2</button>
<button>Category 3</button>
<button>Category 4</button>
</ReactButtonSlider>
<main className="content">
<h1>Your Contents</h1>
</main>
</>
);
};
export default App;
Name | Type | Default | Description |
---|---|---|---|
Children | any |
any component or element | |
overscrollTransition | string |
transform .3s cubic-bezier(.25,.8,.5,1) |
css transition property |
dragAcceleration | number |
1 |
drag acceleration |