UNPKG

@pablosz/react-indiana-drag-scroll

Version:
61 lines (44 loc) 3.16 kB
# React Indiana Drag Scroll > Implements scroll on drag [![NPM](https://img.shields.io/npm/v/react-indiana-drag-scroll.svg)](https://www.npmjs.com/package/react-indiana-drag-scroll) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com) ## Welcome to journey! ![](https://github.com/norserium/react-indiana-drag-scroll/blob/master/example/demo.gif?raw=true) Try it yourself! Go to [demo website](https://norserium.github.io/react-indiana-drag-scroll/). ## Install ```bash npm install --save react-indiana-drag-scroll ``` ```bash yarn add react-indiana-drag-scroll ``` ## Usage ```jsx import React, { Component } from 'react' import ScrollContainer from 'react-indiana-drag-scroll' class Example extends Component { render () { return ( <ScrollContainer className="scroll-container"> { ... } </ScrollContainer> ) } } ``` ## Component properties | Prop | Type | Description | Default | | ------------------ | -------- | ----------------------------------------------------------------------------------------- | ------- | | vertical | Bool | Allow vertical drag scrolling | true | | horizontal | Bool | Allow horizontal drag scrolling | true | | hideScrollbars | Bool | Hide the scrollbars | true | | activationDistance | Number | The distance that distinguish click and drag start | 10 | | children | Node | The content of scrolling container | | onScroll | Function | Invoked when user scrolling container | | onEndScroll | Function | Invoked when user ends scrolling container | | onStartScroll | Function | Invoked when user starts scrolling container | | className | String | The custom classname for container | | style | Number | The custom styles for container | | ignoreElements | String | Selector for elements that should not trigger the scrolling behaviour (for example, ".modal, dialog" or "\*[prevent-drag-scroll]") | | nativeMobileScroll | Bool | Use native mobile drag scroll for mobile devices | true ## License The source code is licensed under MIT, all images (except [hieroglyphs](https://www.freepik.com/free-vector/ancient-egypt-hieroglyphics-background-with-flat-design_2754100.htm)) are copyrighted to their respective owner © [Norserium](https://github.com/norserium)