draggable方法有很多参数,今天我瞎摸弄明白了一下几个:
addclasses:
如果设置成false,将不添加ui-draggable这个class.当调用 .draggable() 初始化上百个元素时,可以优化性能(【王子很坏】提供翻译)
appendto :
进行拖拽时,被传递或被appendto选项选择的元素将被当做draggable helper的容器,默认情况下,helper被追加到那个draggable元素相同的容器中((【王子很坏】提供翻译 , 这个属性我测试没成功。研究中)
axis:
拖拽动作只在 对应的轴向上移动。 参数x 或 y
cancel :
当拖拽对象是cancel说设置的标签或者对象时候,拖拽无效
containment:
限制拖拽对象在参数设置区域,参数可以为 标签 对象 或者 是[x1,y2,x2,y2]的像素区域
cursor:
设置 拖拽动作鼠标样式
cursorat:
设置拖拽动作发生鼠标所在位置 参数为 { cursorat: { left: 5 } } 广州javascript培训
delay:
拖拽动作延迟多少毫秒后响应 参数 毫秒
distance:
拖拽动作离开拖拽对象 一定像素以后 拖拽发生 参数数值
grid :
拖拽动作发生后 造成 对其网格效果, 其效果是每次移动 固定像素距离,参数为 [20, 20]
handle:
设置拖拽对象里面可实现拖拽动作的对象。参数是选择器 类似于浏览器一样,只能通过顶部蓝色条拖拽,但是拖动的是整个浏览器。
helper :
拖拽动作发生时 原始对象不动,复制一个对象给拖拽事件 对象在拖拽结束后是否保存在结束位置取决于参数 'original', 'clone', function. 参数为function的时候不许返回一个 dom标签。
iframefix :
防止应为iframes 的存在导致拖拽在中途丢失
opacity :
设置拖拽时的透明度 参数浮点型 1.00-0.00 拖拽结束后 透明度回复初始状态
scroll :
设置拖动对象被拖动时,是否允许拖出前容器(浏览器)显示区域(也就是说触不发auto-scrolls *关于auto-scrolls请看后面的解释*)。设置为false ,拖动对象碰到边框的时候容器窗口不会随着碰撞移动主体窗口。 注意,这个经过我测试,设置为false 一样会产生滚动条。
scrollsensitivity :
设置拖拽对象被拖拽时与容器发生碰撞的响应距离。貌似这样解释不好理解,通俗的说,就是当你碰到边框的多少像素范围内就发生auto-scrolls事件。
scrollspeed:
当拖拽对象和浏览器边发生碰撞时,容器每次移动主体窗口的距离。
revert :
设置拖拽事件执行完毕后拖拽是否生效,如果不生效那么将以动画方式返回到拖拽对象初始化位置。参数为逻辑值或者字符串'valid', 'invalid';
revertduration : snap: snapmode : snaptolerance: stack : zindex 拖动事件触发时候 z轴改成对应参数,拖拽结束,z轴还原。
注:【aoto-scroll 是自动滚动,也就是说 拖拽对象在碰撞到边框的时候,容器(浏览器)滚动条会自动延伸滚动条 并且屏幕像碰撞方向偏移~】
事件:
拖拽有3个事件,和4个参数 详情可以直接看官方aip那些不用详细说明。 h |