流畅的触摸拖动元素的交互效果，无依赖、轻量且高性能，支持上下左右所有方向。

使用 npm 下载

npm install --save pull-element

// ES2015
import PullElement from 'pull-element'

// commonjs
var PullElement = require('pull-element')

使用 script 标签

<script src="pull-element.js"></script>
<script>
	var pullElement = new PullElement({})
</script>

注意：以下 DEMO 受到了 framework7 的启发。

• Playgound: 源码，DEMO
• Pull To Refresh: 源码，DEMO
• Swipe To Show Action: 源码，DEMO
• Animated Tabs: 源码，DEMO
• Swipeable Tabs: 源码，DEMO
• Slider Horizontal: 源码，DEMO
• Vertical Swiper: 源码，DEMO
• Space Between Slides: 源码，DEMO

PullElement 是一个构造函数，接受一个 options 配置项参数，使用 new 关键字进行实例化。

实例化后，调用 init 方法进行初始化。

var pullElement = new PullElement(options)
pullElement.init()

被拖动的目标，可以是选择器，也可以是元素；默认值为 'body'。

target 元素就是被设置 transform|translate 效果的 dom 对象。

滚动对象，可以是选择器，也可以是元素。如果不配置，默认复用 target 元素作为 scroller。

这个选项在设置了 detectScroll: true 或 detectScrollOnStart: true 之后，才有作用。

只有滚动到边缘之后，才开始拖动元素。

触发对象，可以是选择器，也可以是元素。如果不配置，默认复用 target 元素作为 trigger。

只有触摸 trigger 区域，才会触发拖动元素的效果。

拖动元素的阻尼系数，可以是数字，也可以是函数，默认值为 1.6。

设用户拖动长度为 x， damping 系数为 y，则元素的拖动长度 d 的计算方式为：d = x/y。

如果 damping 为函数，则 d = y(x)。

是否开启上拉拖动效果，默认为 false。

是否开启下拉拖动效果，默认为 false。

是否开启左拉拖动效果，默认为 false。

是否开启右拉拖动效果，默认为 false。

是否开启监听滚动特性，默认为 false。

开启后，只有检测 scroller 元素滚动到边缘之后，才开始拖动元素。

是否开启在 touchStart 时检测滚动状态的特性，默认为 false。

detectScroll 配置既在 touchStart 时检测，也在 touchMove 时检测；当 detectScroll 为 false，detectScrollOnStart 为 true 时，将只在 touchStart 时检测滚动状态。

是否在 touchStart 时停止事件冒泡，默认为 false。

该配置项的作用在于，嵌套两个 pull-element 效果时，子元素可以独立，其拖动效果不影响父元素。

是否开启自由拖动效果，默认为 false。

开启后，target 元素的拖动不再只能是 X 轴或 Y 轴（默认行为是：其中一个轴的 translate 值被设置为 0），它将在 X 轴和 Y 轴都有偏移效果。

target 元素回归原点的过渡时长，默认为 0.3s。

结束拖动，即释放 target 元素时，target 元素将默认滚动回原点。

target 元素回归原点的过渡函数，默认为 ease-out。

结束拖动，即释放 target 元素时，target 元素将默认滚动回原点。

是否在拖动结束时，等待回归原点后才允许再次拖动，默认为 true。

如果设置为 false，在过渡回原点时，也可以被重新拖动。

开启并响应某个方向的拖动事件，Direction 可以为 Up|Down|Left|Right。

接受一个参数：data。data 参数包含两个字段，translateX 和 translateY，分别是 X 轴和 Y 轴的偏移值，该值已经经过了 damping 的折算。

如果在该方法里调用 this.preventDefault() 方法，将阻止默认行为，即 target 元素在此次事件里不会被设置偏移。

var pullElement = new PullElement({
	onPullUp: function(data) {
		var translateX = data.translateX
		var translateY = data.translateY
		this.preventDefault()
	}
})
pullElement.init()

开启并响应某个方向的拖动结束事件，Direction 可以为 Up|Down|Left|Right。

接受一个参数：data。data 参数包含两个字段，translateX 和 translateY，分别是 X 轴和 Y 轴的偏移值，该值已经经过了 damping 的折算。

如果在该方法里调用 this.preventDefault() 方法，将阻止默认行为，即 target 元素不会自动过渡回原点。

var pullElement = new PullElement({
	onPullUpEnd: function(data) {
		var translateX = data.translateX
		var translateY = data.translateY
		this.preventDefault()
	}
})
pullElement.init()

初始化 PullElement 实例，该方法将绑定 touch 事件。

销毁 PullElement 事例，该方法将解除 touch事件。

开启对 touch 事件的响应能力，即绑定 touch 事件。在 init 方法里会调用。

可以用该方法主动开启 touch 绑定。

关闭对 touch 事件的响应能力，即解除 touch 事件。在 destroy 方法里会调用。

可以用该方法主动关闭 touch 绑定。

设置 target 元素的偏移值，参数 translateX 和 translateY 都是 number 数值类型。

该方法用于在调用 this.preventDefault() 方法后，手动设置偏移值。

以过渡的动画形式设置偏移值，前两个参数跟 setTranslate 方法一致，第三个参数为动画结束后触发的 callback 函数。

该方法在支持 promise 的浏览器里会返回 promise。

以过渡的动画形式回归到原点，第一个参数为动画结束后触发的 callback 函数。

该方法在支持 promise 的浏览器里会返回 promise。

阻止默认行为。该方法必须在 onPull{Direction} 和 onPull{Direction}End 配置项里执行。

当在 onPull{Direction} 里执行时，所阻止的默认行为是 this.setTranslate(translateX, translateY)

当在 onPull{Direction}End 里执行时，所阻止的默认行为是 this.animateToOrigin()

License: MIT (See LICENSE file for details)