
以上为组件的属性,一下对属性做实践操作解释:
draggable提供可拖动控件
实现方式(js):
页面定义:
<div id="box" class="easyui-draggable" style="width:400px;height:200px;background:orange;"> <span id="resurce">内容可拖动</span> </div>
js实现: $('#box').draggable({
revert:true, //拖动停止后,是否返回原位置
cursor:'text', /拖动时鼠标的图形变换
//handle: '#resurce', //设置哪些内容才能触发拖动
edge:10, //设置拖动时距离拖动容器边缘的宽度
//disabled:false, //设置是否可拖动
axis:'v', //设置拖动水平'h',还是垂直'v'
proxy:'clone', //设置拖动时是否克隆原内容
deltaX:10, //鼠标距离拖动触发位置水平距离x
deltaY:10, //鼠标距离拖动触发位置垂直距离y
proxy:function(source){ //自定义克隆元素内容
var p = $('<div style="border:1px solid #ccc ; width:400px;height:200px;"></div>');
p.html($(source).html()).appendTo('body');
return p;
}
});
事件列表(如下表解释,不做过多解释):

方法列表:

解释如下:

代理元素需要在拖动前或开始的function中定义,clone是在开始的时候才能clone。
|