dragscroll-ts v1.0.4

🎉 DragScroll library

Drag Scroll library - smooth content scroll via mouse/touch dragging. Publish standard format Js such as commonJs, ES Modules, UMD, Typescript

Why DragScroll ?

• More comfortable with physical UI, make consistency between different devices

Usage

First of all, you need to import this library:

// Javascript tag
<script type="type/javascript" src="https://unpkg.com/dragscroll-ts@1.0.2/build/dragscroll.min.js"></script>

// Common Javascript
const DragScroll = require('dragscroll-ts')

// ES6 Module Javascript
import DragScroll from 'dragscroll-ts'

// Typescript
import DragScroll, { IDragScrollOptions } from 'dragscroll-ts'

const options: IDragScrollOptions = {}

interface IDragScrollOptions {
    $container: HTMLElement
    $content: HTMLElement
    axis: string
    allowInputFocus?: boolean
    allowSelectText?: boolean
}

Next step, init drag scroll instance

- NOTE: This library only wrap dragscroll logic on available HTML, It doesn't touch to stylesheet 😉
- Need to be specified the HTML structure of $container, $content elements. See picture below

const $container = document.getElementById('demo-wrapper')
const $content = document.getElementById('demo-content')

new DragScroll({
    $container: $container,
    $content: $content,
    axix: 'x',
    allowInputFocus: true,
    allowSelectText: false,
})

Config options

API

Events

The evt parameter is either MouseEvent or TouchEvent

// Example:
const dragSroll = new DragScroll({})
function handler(evt) {}

dragSroll.on('dragstart', handler)
dragSroll.off('dragstart', handler)

Files size

License

MIT License (c) 2020 XuanVinh