DraggableEl

Browser Support

This lib uses transform-function, requestAnimationFrame. Their compatibilities are:

Chrome, Firefox, Safari, Edge15, IE10

Usage

demo

1. download package

npm i --save draggable-el

2. import with require or <script>

let DraggableEl = require('draggable-el')

or

<script src="./node_modules/draggable-el/dist/DraggableEl.min.js"></script>

3. initialize/destroy instance

• initialize instance

let config = {
  dragButton: document.getElementById('app__drag_el'),
  dragEl: document.getElementById('app__drag_bo')
}
let instance1 = new DraggableEl(config)

more about config

• destroy instance

instance1.destroy()

• destroy all instances

instance1.destroyAll()

Config

Warning

• If rotate is in your transform or default mode is not good, set isLeftTop:true in your config.

Other Shiny Libs

• interact.js
• plain-draggable

TODO

• [x] support npm
• [x] support browser
• [ ] add tests
• [x] support mobile touch behavior
• [x] add readme config
• [x] avoid overwrite transform other values