dragging

Dragging.js is a simple javascript library for dragging elements. Note that this lib works only if the target element's position set to be 'relative', 'absolute', or 'fixed'.

Quick Start

import dragging from './dragging.js'

let ele = document.getElementById('ele')

dragging(ele, {
  cursor: 'pointer', // the cursor effect while mouse hovering on the target element.
  
  // 1.for absolutely positioned element, the margin specifies the minimum spaces(in pixels) kept 
      to the border of the element's containing block. 
    (The containing block is the ancestor to which the element is relatively positioned.)
  // 2.for fixedly positioned element, the margin specifies the minimum spaces(in pixels) kept 
      to the border of the current viewport.
  // 3.for relatively positioned element, margin will be ignored.
  margin: 10,

  onStart: (e) => { console.log('onstart..', e) }, // triggered on drag start.
  onDragging: (e) => { console.log('ondragging..', e) }, // triggered on dragging
  onEnd: (e) => { console.log('onend..', e) }, // triggered on drag end
})

Examples

1.position: absolute;

2.position: fixed;

3.position: relative;

Install

You can get it on npm.

npm install dragging --save

Contributing

dragging.js is a free and open source library, and I appreciate any help you're willing to give - whether it's fixing bugs, improving documentation, or suggesting new features.