react-scroll-ondrag

react-scroll-ondrag

Scroll your elements by dragging your mouse

Live demo

You can see the simplest demo here: Live demo

Install

$ npm install --save react-scroll-ondrag

Examples

Run examples:

$ cd examples
$ npm install
$ npm start

Usage

import React, { useRef } from 'react';
import useScrollOnDrag from 'react-scroll-ondrag';

const App = () => {
  const ref = useRef();
  const { events } = useScrollOnDrag(ref);

  return <div {...events} ref={ref} />;
};

Arguments

ref

Type: a React ref, required

A ref to the DOM element whose scroll position you want to control

options

Type: object

options.onDragStart

Type: function: () => void

Called when scrolling by dragging starts

options.onDragEnd

Type: function: () => void

Called when scrolling by dragging ends

Return value

Type: object, shape: { events: { onMouseDown } }

An object with the events to inject to the controlled element.

License

See the LICENSE file for license rights and limitations (MIT).