博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Jquery-ui draggable
阅读量:5860 次
发布时间:2019-06-19

本文共 796 字,大约阅读时间需要 2 分钟。

Jquery ui的draggable插件让某个元素能被鼠标拖拽。

 

draggable和droppable的区别:

draggable只是控制拖拽,如果你要控制拖拽和放下两个动作,你需要使用的是droppable插件

 

draggable有三个事件可以定义回调函数:

start, stop, drag

 

 

这三个事件定义的回调函数可以有两个参数,一个是原始的浏览器定义的事件,另一个是插件定义的事件,假定为ui

ui拥有的属性有:

ui.helper

ui.position

ui.offset

 

 

drag的动作的时候可以设置helper,就是在拖动的时候鼠标旁边显示的提示工具条

draggable的属性有:

disabled: 是否设置此属性可拖拽

addClass:当设置为false的时候,ui-draggable这个class就不会加到上面

appendTo: 指示draggable的时候的helper的container

axis:允许的值是x或者y,限定拖拽只能在x轴变化和只能在y轴变化

connectToSortable:

containment: 拖拽元素所在的容器

cursor: 拖拽的时候鼠标样式

cursorAt: 设置helper相对于鼠标的位置

delay: 设置拖拽动作生效的延迟时间

distance: 设置拖拽动作生效的延迟距离

grad:拖动过程中鼠标移动的单位

helper: helper显示设置

iframeFix:解决拖动过程中与iframe层叠后的事件问题

opacity:设置helper的透明度

refreshPositions: 是否重新计算位置

revert:设置拖拽回复到原始位置

revertDuration:拖拽回复到原始位置的延迟时间

scope: 设定draggable的域, 用来和droppable结合使用时确定可放入的目标

转载地址:http://lmejx.baihongyu.com/

你可能感兴趣的文章
Android TabActivity使用方法
查看>>
java ShutdownHook介绍与使用
查看>>
Eclipse的 window-->preferences里面没有Android选项
查看>>
《麦田里的守望者》--[美]杰罗姆·大卫·塞林格
查看>>
[置顶] 深入探析Java线程锁机制
查看>>
ORACLE 日期函数[转载]
查看>>
遇到的那些坑
查看>>
央行下属的上海资信网络金融征信系统(NFCS)签约机构数量突破800家
查看>>
[转] Lazy evaluation
查看>>
常用查找算法总结
查看>>
grep 零宽断言
查看>>
被神话的大数据——从大数据(big data)到深度数据(deep data)思维转变
查看>>
修改校准申请遇到的问题
查看>>
【DL-CV】浅谈GoogLeNet(咕咕net)
查看>>
python大佬养成计划----win下对数据库的操作
查看>>
Mysql 中创建索引和索引的使用问题
查看>>
(cons '(〇 . 前言) 《为自己写本-Guile-书》)
查看>>
监控软件zabbix之安装
查看>>
No architectures to compile for (ONLY_ACTIVE_ARCH=YES, active arch=arm64, VALID_ARCHS=armv7 armv7s)
查看>>
Exchange Server 2016 独立部署/共存部署 (七)—— DAG功能测试
查看>>