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

1. import with require or <script>

let DraggableEl = require('draggable-el')

or

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

1. 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

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