描述

让被选择元素可以被鼠标拖动,详见 http://www.jqueryui.com/draggable/

参数

允许动态属性:

false
名称 必需 默认值 类型 描述
addClasses   true Boolean 如果值设置为false, ui-draggable样式类将不能被添加引用。当在大量元素上调用.draggable()时,你可能会想要这样设置,作为一个性能优化。详见 http://api.jqueryui.com/draggable/#option-addClasses
appendTo   parent String 当进行拖动时,拖动组件助手应该被添加到的元素。可选值为 parent 或 jQuery 选择器。详见 http://api.jqueryui.com/draggable/#option-appendTo
axis     String 约束拖动的动作只能在水平(x轴)或垂直(y轴)上执行。可选值: x, y。详见 http://api.jqueryui.com/draggable/#option-axis
cancel   input,textarea,button,select,option String 防止在指定元素上开始拖动。详见 http://api.jqueryui.com/draggable/#option-cancel
connectToSortable     String 允许draggable被拖拽到指定的sortables中。如果使用了该选项,被拖动的元素可以被放置于一个应用了排序组件的元素列表中并成为该列表的一部分。注意: 为了完美的使用该特性,helper选项必须被设置为 clone。详见 http://api.jqueryui.com/draggable/#option-connectToSortable
containment     String 可以限制draggable只能在指定的元素或区域的边界以内进行拖动。可以是一个 jquery 选择器或 parent, document, window,详见 http://api.jqueryui.com/draggable/#option-containment
cursor   auto String 指定在做拖拽动作时,鼠标的CSS样式。详见 http://api.jqueryui.com/draggable/#option-cursor
cursorAt     String 设置拖动帮手相对于鼠标光标的偏移量。坐标可被指定为一个散列 使用的组合中的一个或两个键:{ top, left, right, bottom } 。详见 http://api.jqueryui.com/draggable/#option-cursorAt
delay   0 Integer 当鼠标按下后,指定时延迟间后才开始激活拖拽动作(单位:毫秒),此选项可用来阻止当点击一个元素时可能发生的非期望拖动行为。详见 http://api.jqueryui.com/draggable/#option-delay
disabled   false Boolean 如果该值设置为true,拖动特效将被禁用。。详见 http://api.jqueryui.com/draggable/#option-disabled
distance   1 Integer 当鼠标点下后,只有移动指定像素后才开始激活拖拽动作,单位为像素,此选项可用来阻止当点击一个元素时可能发生的非期望拖动行为。详见 http://api.jqueryui.com/draggable/#option-distance
grid     Integer[] 拖拽元素时,只能以指定大小的方格进行拖动。数组形式为[ x, y ]。详见 http://api.jqueryui.com/draggable/#option-grid
handle     String 只有在特定的元素上触发鼠标按下事件时,才可以拖动。 只有被拖到元素的子元素才可以应用该参数。详见 http://api.jqueryui.com/draggable/#option-handle
helper     String 允许一个元素被用来进行拖动。如果值设置为 clone, 那么该元素将会被复制,并且被复制的元素将被拖动。详见 http://api.jqueryui.com/draggable/#option-helper
iframeFix   false Boolean 在拖动期间阻止 iframe 捕捉鼠标移过事件。当鼠标指针可能不在拖动助手元素之上时,该参数非常有用。详见 http://api.jqueryui.com/draggable/#option-iframeFix
onDragTopics     String 当鼠标在拖动过程中移动时触发,详见 http://api.jqueryui.com/draggable/#event-drag
onStartTopics     String 当拖动开始时触发,详见 http://api.jqueryui.com/draggable/#event-start
onStopTopics     String 当拖动停止时触发,详见 http://api.jqueryui.com/draggable/#event-stop
opacity     Float 当拖动时,拖动助手元素的不透明度。值为 0.01 到 1 之间,详见 http://api.jqueryui.com/draggable/#option-opacity
refreshPositions   false Boolean 如果设置为true, 所有的可拖动位置在每次鼠标移动时都会被计算。注意: 这解决了具有高度动态内容页面的问题,但是却降低了性能。详见 http://api.jqueryui.com/draggable/#option-refreshPositions
revert   false Boolean 当拖动停止时,元素是否要被重置到它的初始位置。详见 http://api.jqueryui.com/draggable/#option-revert
revertDuration   500 Integer 动画重置时间, 单位为微秒。如果revert选项设置为false,则忽略(即被拖到元素不会被重置)。详见 http://api.jqueryui.com/draggable/#option-revertDuration
scope   default String 被用来将拖动组件和拖动至容器组件的参数进行分组, 除了拖动至容器组件的 accept 选项。 如果一个一般拖动组件的scope参数值和一个拖动至容器组件的scope参数值一样,那么这个一般拖动组件将被接受为拖动至容器组件。详见 http://api.jqueryui.com/draggable/#option-scope
scroll   true Boolean 如果设置为true, 当拖动时,div盒模型将自动翻滚。详见 http://api.jqueryui.com/draggable/#option-scroll
scrollSensitivity   20 Integer 离开可视区域边缘多少距离开始滚动。距离是相对指针进行计算的,而不是被拖到元素本身。如果 scroll 选项设置为false,则不滚动。详见 http://api.jqueryui.com/draggable/#option-scrollSensitivity
scrollSpeed   20 Integer 当鼠标指针的值小于scrollSensitivity的值时,窗口滚动的速度。如果scroll选项设置为false,则该参数无效。详见 http://api.jqueryui.com/draggable/#option-scrollSpeed
snap   false Boolean 决定一个元素是否应该吸附到其它元素上。当设置为 true时, 元素将可以吸附到所有其它可拖动元素上。详见 http://api.jqueryui.com/draggable/#option-snap
snapMode   both String 决定可拖动元素将要吸附到哪个元素的边缘。如果snap选项设置为 false,则忽略该参数。 可选值: inner, outer, both,详见 http://api.jqueryui.com/draggable/#option-snapMode
snapTolerance   20 Integer 当距离可吸附元素多远时,触发吸附事件。如果snap选项设置为false,则忽略该参数。详见 http://api.jqueryui.com/draggable/#option-snapTolerance
stack     String 控制由选择器所触发的一系列元素的z-index值, 总是将当前被拖动对象至于最前。对于像窗口管理这样的应用来说,非常有用。详见 http://api.jqueryui.com/draggable/#option-stack
zIndex     Integer 当被拖动时,拖动助手的Z-index值。详见 http://api.jqueryui.com/draggable/#option-zIndex

示例代码

example descript...

这里是示例代码块