drag-block

一个简单的、将所有设置定位的元素变为可拖拽的小工具。

Installation

通过npm安装：

$ npm i -S drag-block

或直接获取源码：

Releases

Usage

在项目中import(ES6 modules)

import DragBlock from 'drag-block'

或在html中用引入源码中的lib/drag-block.js：

<script src="drag-block.js"></script>

然后在js中使用：

let drag = new DragBlock(DomElement[, options])

可以监听相应的事件：

drag.on('dragStart', target => {
  console.log(target.style.left)
})

其中DomElement是需要可拖拽的position: fixed | absolute | reletive元素，options是选项对象。

本工具不负责处理目标元素的样式之类

Options

参数	说明	类型	默认值
useDragBar	是否使用弹出的拖拽条，false时直接拖拽目标本体	Boolean	true

更多功能和配置项后续添加～欢迎提交issue～

Events

事件名称	说明	回调参数
dragStart	点击bar或者本体开始拖动时触发	目标dom
dragEnd	拖动结束时触发	目标dom

Example

https://kinice.github.io/drag-block/