Jquery Drag and Drop

最新推荐文章于 2024-08-31 10:02:16 发布

dieyanxiu7528

最新推荐文章于 2024-08-31 10:02:16 发布

阅读量137

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/ajunForNet/p/3776476.html

版权

本文介绍了一款基于jQuery1.2.*的拖拽插件——jquery.dragndrop，该插件简化了HTML DOM元素的拖拽操作。文章详细解释了插件的配置选项，包括zIndex、opacity、handler等，并提供了onMove和onDrop事件的使用方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jquery.dragndrop 是基于 jQuery 1.2.* 开发的一款 jQuery 插件，为用户实现 html dom 拖拽提供了更为便捷的方法。

Demo 效果如下：

源码可到此下载：jquery.dragndrop.js

API简介：

zIndex(Int): 拖拽发生时拖拽对象的 z-index 值, 主要是为了防止被遮挡, 默认值为20,
opacity(Float): 拖拽发生时拖拽对象的透明度, 最大为 1 最小为 0, 默认值为 0.7,
handler(String|Object): 拖拽柄, 比如一般的窗口, 标题部分就为拖拽柄, 当点击拖拽柄使会拖拽整个拖拽对象, 默认值为 null, 必须指定, 可为jQuery筛选器对象，如 '.drag' 或 '#drag' , 也可以为jQuery对象，如 $('.drag'),
onMove(Function): 拖拽发生时的触发事件, 默认值为 function(e) { }, 参数e为拖拽对象参数, 如可使用e.pageX, e.pageY来获取当前对象位置, 使用cookie存储, 同样也可通过 e.data.dragData获取拖拽对象其他参数, 具体内容可查看源码,
onDrop(Function): 拖拽结束时触发的事件, 默认值为 function(e) { },参数说明同上.

如有不明白的地方可以直接查看源码中的示例.

在线演示：live demo

转载于:https://www.cnblogs.com/ajunForNet/p/3776476.html