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/