jquery sortable组件配置参数中文注释及demo
2017-05-08 18:40
309 查看
$(document).ready(function(){ $(".sortable").sortable({ //排序组件初始化 appendTo: $(".distination"), //不知道作用 //axis : "y", //定义移动方向 x:水平 y:竖直 cursor: "move", //拖拽时鼠标样式 items: ".sort_item", //定义可拖拽的元素 cancel: "a,button", //匹配的元素阻止排序事件 classes: {"ui-sortable": "highlight"}, //设置排序元素样式 connectWith: ".distination", //多个排序元素间互相拖拽排序 //containment : "#content1", //排序容器,拖拽不能超出容器范围 //cursorAt : { right: 5 }, //拖拽时,元素始终跟随鼠标的位置 { top, left, right, bottom } //delay : 2000, //排序拖拽之后延迟时间 //distance: 35, //鼠标移动多少距离之后开始排序事件 dropOnEmpty: true, //结合connectWith属性, 是否可以拖拽到空的排序元素中 //forceHelperSize : false, //强制帮助元素有一个大小 未测试 //forcePlaceholderSize: true, //未测试 //grid: [ 20, 100 ], //每次移动的坐标 //handle: ".handle", //元素句柄,类似于windows系统中的窗口头部 helper: "clone", //帮助元素的显示方式 , "original" "clone" 默认original opacity : "0.6", //设置帮助元素透明度 placeholder: "sortable-placeholder", //设置占位符样式 revert : 1000, //设置动画时间 true,false,number scroll : true, //拖动到滚动条底部的时候是否向下滚动 默认true scrollSensitivity: 60, //scroll为true时,鼠标距离滚动条顶部或底部多少像素是触发滚动事件 scrollSpeed : 20, //滚动条滚动速度, scroll为true时生效 tolerance :"pointer", //指定鼠标超过元素多少时重新排序, intersect:超过百分之五十 pointer:鼠标移入另一个个元素时 默认:intersect zIndex: 999, //设置辅助元素的堆叠顺序 未测试 activate: function(event, ui){ $("#eventBox").text("排序事件被激活"); }, beforeStop: function( event, ui ){ //$("#eventBox").text("排序事件完成前"); }, change: function( event, ui ){ //$("#eventBox").text("排序改变事件"); }, create: function( event, ui ){ //$("#eventBox").text("排序组件被创建"); }, deactivate: function( event, ui ){ //$("#eventBox").text("排序事件完成后"); }, out:function( event, ui ){ //$("#eventBox").text("排序组件被移出"); }, over:function( event, ui ){ //$("#eventBox").text("移到另一个排序组件上方"); }, remove:function(event, ui){ $("#eventBox").text("移出组件"); }, sort: function (event, ui){ $("#eventBox").text("正在排序"); } //start stop update }); $(".distination").sortable({ connectWith: ".sortable", receive:function(event, ui){ //$("#eventBox").text("接收组件"); } }); $(".sort_item").click(function(){ //alert(1); }); });
完整例子下载地址:jquery-sortable完整例子
相关文章推荐
- Ext各组件属性配置(上) -- 中文注释
- Ext各组件属性配置(上) -- 中文注释
- FCKeditor2.4(FCKeditot for java2.3)的用法及配置参数说明(已解决中文乱码)
- FreeBSD系统优化部分内核参数调整中文注释[zz]
- Linux系统优化部分内核参数调优中文注释
- 我的vim配置文件(带详细中文注释)
- 蜻蜓resin3.1配置文件中文注释
- 体验Castle中从配置文件注册组件以及传递参数的一个小例子
- struts2.2.3 配置中文乱码拦截过滤器 解决接收中文参数乱码问题
- log4j的配置文件[log4j.properties],带详细的中文注释,留底自用
- log4j的配置文件[log4j.properties],带详细的中文注释,留底自用
- Yii框架表单组件配置参数说明
- FreeBSD系统优化部分内核参数调整中文注释
- FreeBSD系统优化部分内核参数调整中文注释
- Nginx配置文件中文注释详解(参考)
- Nginx配置文件中文注释详解
- FreeBSD系统优化部分内核参数调整中文注释
- JVM配置参数中文说明
- cisco3600配置DHCP详细步骤(中文图解注释)
- PostgresSQL数据库配置参数中文说明