react-horizontal-auto-scroll

While scrolling through a webpage users often miss any content that is needed to be scrolled horizontally. With this React component one can overcome this issue easily both on desktops and mobile.

Install

npm install --save react-horizontal-auto-scroll

Usage

import React from 'react';
import  Scroller  from  'react-horizontal-auto-scroll';

  

function  App() {
	
	return (
	<div  className="App">
		//Content
		//.............
		// More content
		<Scroller className="row">
			<Col>CONTENT</Col>
			<Col>CONTENT</Col>
			<Col>CONTENT</Col>
			<Col>CONTENT</Col>
			<Col>CONTENT</Col>
			<Col>CONTENT</Col>
			<Col>CONTENT</Col>
		</Scroller>
		//Content
		//.............
		// More content
	</div>
	);
}

Here is a list of all props that Scroller accepts :

| Name | Required | Type | Default | Description| |:---- |:---- |:---- |:---- |:----| |scrollSpeed |false| Number | |Scroll speed depends on number ranging from 1-10 | |isSlideShow |false| Boolean | |When set to true the horizontal scrolling will work kind of like a slideshow| |reverse |false| Boolean | |When set to true horizontal reverse scrolling will trigger while scrolling up | |children |false| ReactNode | | A number of child elements need to passed for it to work |

You can pass all html props to Scroller.