@author YHC
覆盖默认值$.fn.draggable.defaults
使用示例
从标记创建draggable
<div id="dd" class="easyui-draggable" data-options="handle:'#title'" style="width:100px;height:100px;">
<div id="title" style="background:#ccc;">title</div>
</div>
使用javascript创建draggable
<div id="dd" style="width:100px;height:100px;">
<div id="title" style="background:#ccc;">title</div>
</div>
$('#dd').draggable({
handle:'#title'
});
属性
| Name | Type | Description | Default |
|---|---|---|---|
| proxy | string,function |
一个代理元素使用在拖动的时候, 当设置 'clone', 一个clone的元素使用作为代理对象.如果是定义的一个函数 , 它必须返回一个jQuery对象.
下面示例展示,如何创建一个简单的代理对象. $('.dragitem').draggable({
proxy: function(source){
var p = $('<div style="border:1px solid #ccc;width:80px"></div>');
p.html($(source).html()).appendTo('body');
return p;
}
});
|
null |
| revert | boolean | 如果设置为, 当拖动结束的使用,这个元素将回到它开始的位置. | false |
| cursor | string | 当拖动的时候,一个css cursor(鼠标的样式,自己查css文档). | move |
| deltaX | number | 拖动元素位置x对应当前光标. | null |
| deltaY | number | 拖动元素位置y对应当前光标. | null |
| handle | selector | 可以被拖动的元素的选择器. | null |
| disabled | boolean | true停止拖拽. | false |
| edge | number | 拖动的宽度,距离边缘多少可以被拖动. | 0 |
| axis | string | 定义一个拖动元素拖动的轴,可用值有: 'v' or 'h', 当设置为null 时,可以水平和垂直方向随意拖动. | null |
事件
| Name | Parameters | Description |
|---|---|---|
| onBeforeDrag | e | 拖动之前触发, 返回false取消拖动动作. |
| onStartDrag | e | 目标对象开始拖动时触发. |
| onDrag | e | 拖动期间触发. 返回false将不能拖动. |
| onStopDrag | e | 当拖动结束时候触发. |
方法
| Name | Parameter | Description |
|---|---|---|
| options | none | 返回 options 属性. |
| proxy | none | 如果proxy属性已经设置,返回拖动的代理对象. |
| enable | none | 启用拖动动作. |
| disable | none | 禁用拖动动作. |
以上如有错误信息,请指出,thanks!