YAH-Scroller
Yet another horizontal scroller for React.
A simple and lightweight component that allows you to scroll horizontally through a list of items on both mobile and desktop with a small 'stretch' effect.
I couldn't find something fast enough so I made one myself it's simple and effective. Do you encounter any issues please let us know!
Installation:
npm install yah-scroller --save-dev
or
yarn add -D yah-scroller
Usage :
Add YahScroller to your component:
import React from 'react'
import ReactDOM from 'react-dom/client'
import { YahScroller } from 'yah-scroller'
import 'yah-scroller/assets/style.scss';
// you can include the css version if needed
const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement)
root.render(
<React.StrictMode>
<div>
<h2>Simple scroller</h2>
<YahScroller className="horizontal-scroll">
<div key={'c1'} className={'category'}>Category 1</div>
<div key={'c2'} className={'category'}>Category 2</div>
<div key={'c3'} className={'category'}>Category 3</div>
<div key={'c4'} className={'category'}>Category 4</div>
<div key={'c5'} className={'category'}>Category 5</div>
<div key={'c6'} className={'category'}>Category 6</div>
</YahScroller>
</div>
</React.StrictMode>,
)
You like it? Or want something to be added?
Please let us know!
What I plan to add:
- different version to use styled components of someone whishes to use it
- more customisations possible
- switch between vertical or horizontal
- example page(s)
Top comments (0)