例:
$('.selected').Sortable({
accept : 'movedata',
opacity : 0.3,
revert : true,
axis : 'vertically',
onStop : function(){
$(this).css('left','0');
},
});
$('.selected')--在该对象内拖动,该对象必须设置高度,否则可能只能将对象移到最顶和最末.子对象不要用float属性
现在我还有一个BUG,就是在IE下,同一个子对象只能拖动一次.
没写的我也不知道
accept-- 需要被移动对象的classname
activeclass -- 移动时的样式
hoverclass -- 移动经过时的样式
helperclass -- 放置移动对象的目标位置样式
opacity -- 移动时的透明度
ghosting -- 为真时,helpercall对象将有一份操作对象的复制
tolerance 'pointer', 'intersect' or 'fit'
fit -- boolean
fx 释放时的动画速度
onchange -- function(obj) 对象位置改变时触发
floats -- 对象是否float
containment -- (parent)只可以在父容器中移动
axis --
handle -- 拖动指定对象进行移动,忽略的话即为整个对象
cursorAt -- 元素拖动位置与光标位置的偏移量的指定。接受top,bottom,left,right的偏移量。
onHover function
onOut -- function(obj) 对象被移出指定容器时触发
onStart -- function(obj) 对象开始移动时触发
onStop function
分享到:
相关推荐
6. **高级应用**:除了基本功能,jQuery UI还提供了许多高级特性,如拖放(Draggable)、可连接的排序列表(Connectable Sortables)等。利用这些功能,可以构建出复杂的交互式界面。 总的来说,"jquery-ui-1.10.3....
### jQuery UI 插件使用详解 #### 一、概述 jQuery UI 是一款基于 jQuery 的用户界面库,提供了丰富的用户交互组件和效果。它不仅简化了前端开发中的许多复杂任务,如拖拽、排序等,还提供了多种视觉效果,极大地...
3. **交互(Interactions)**:如拖放(Draggable)、可排序(Sortable)、可连接的可排序(Connectable Sortables)等,使得网页元素可以进行动态操作,提升用户体验。 4. **主题(Theming)**:jQuery UI 提供了...
选项说明:http://docs.jquery.com/UI/Sortables/sortable#options 选项实例:http://dev.jquery.com/view/trunk/plugins/ui/demos/ui.sortable.html 1.4 Selectables 选择 所需要的文件 jquery.dimensions.js ...
jQuery UI的sortables的扩展,以提供高度可定制的对象列表。 许可证: jQuery> = 1.8.3 基本用法 首先,您必须定义可列出的元素可以使用的类型。 您可以通过实例化可列出对象的数组来做到这一点。 每个对象必须...
jQuery UI Sortables 允许用户通过拖放操作来重新排序列表项,广泛应用于任务管理、购物清单等需要动态调整顺序的场景。 6. **锚链接的无序列表 (4-锚链接的无序列表.htm)** 这个案例演示了如何使用jQuery创建一...
它允许自定义速度、方向、过渡类型等参数,适用于创建引人注目的图像展示。 4. **25 -2 表单Check样式.htm** 这个示例可能是关于表单元素,特别是checkbox的美化和交互增强。jQuery可以通过改变CSS样式来美化表单...
6. **拖拽功能**:`37 - Sortables demo 拖拽插件.htm`可能涉及到jQuery UI Sortable,它允许用户通过拖放操作重新排序列表项目。 7. **无序列表与锚链接**:`4-锚链接的无序列表.htm`可能介绍如何使用jQuery实现更...
`draggable(options)` 方法可以接受多种选项参数,具体配置可见官方文档说明和实例链接。 ##### 1.2 接收拖拽(Droppables) 要实现接收拖拽的组件,需要引入: - dragdrop - ui.mouse.js - ui.draggable.js - ui....
jQuery UI 是一个基于 jQuery JavaScript 库的用户界面插件集合,它提供了丰富的交互效果、可定制的主题以及多种可重用的组件。这个压缩包“jquery-ui-1.8rc1.custom”很可能包含了jQuery UI 1.8 Release Candidate ...
jQuery UI 是一个强大的开源库,它是基于 JavaScript 和 jQuery 框架构建的,提供了丰富的用户界面组件和交互功能。这个压缩包"jqueryUI包"包含了完整的 jQuery UI 库,允许开发者轻松地为网页添加各种交互元素,...
**jQuery 拖拽插件详解** 在网页开发中,用户交互性是至关重要的,而拖放(Drag and Drop)功能则能极大地提升用户体验。jQuery,一个轻量级且强大的JavaScript库,为开发者提供了实现拖放操作的便利。本文将详细...
接受拖拽元素、激活和悬停样式、掉落事件回调等功能可自定义,选项详细说明见[JQuery UI Droppables](http://docs.jquery.com/UI/Droppables/droppable#options)。 3. **Sortables(排序)**: 需要`jquery....
jQuery UI 是一个基于 jQuery JavaScript 库的用户界面插件集合,它提供了丰富的交互效果、可自定义的主题以及各种用户界面组件。这个“jQuery UI code”压缩包可能包含了使用 jQuery UI 创建交互式网页所需的一些...
jquery需要的所有js文件 /*! * jQuery UI 1.8.18 * * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT or GPL Version 2 licenses. * http://jquery.org/license * ...
Sortables demo 拖拽插件实例,自动感应落点,也就是拖动的时候,会有一个虚线框自动跟着你,会为你定位你是否要在某一个落点结束,本虚线框可为你自动纠正你的手动错误,使拖动后的网页下整齐美观,和拖动之前一个...
选项说明:http://docs.jquery.com/UI/Sortables/sortable#options 选项实例:http://dev.jquery.com/view/trunk/plugins/ui/demos/ui.sortable.html 1.4 Selectables 选择所需要的文件 jquery.dimensions.js ui....
选项说明:http://docs.jquery.com/UI/Sortables/sortable#options 选项实例:http://dev.jquery.com/view/trunk/plugins/ui/demos/ui.sortable.html 1.4 Selectables 选择 所需要的文件 jquery.dimensions.js ui....
在提供的代码中,我们看到一个名为 `sortables_init` 的函数,这个函数会在页面加载完成后被调用(通过 `addEvent(window, "load", sortables_init);`)。它的作用是遍历文档中的所有表格,查找具有 "sortable" 类的...
jQuery UI 是一个基于 jQuery 的库,它提供了丰富的用户界面组件和交互效果,极大地扩展了 jQuery 的功能。在本文中,我们将深入探讨 jQuery UI 中的各种效果和接口,包括鼠标交互、互动效果以及一些实用的组件。 ...