web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置：
首页
>
网页特效
>
其他
DDSort-简单实用的jQuery拖拽排序插件
分类：
其他
日期：
2024-05-14
点击(0)
评论(0)
演 示
免费下载
简介
实用该拖拽排序插件需要在页面中引入jquery文件和ddsort.js文件。 ```html <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/ddsort.js"></script> ``` ##### HTML结构 如果你使用一个无序列表作为你需要拖拽排序的元素，结构如下： ```html <div id="wrap"> <ul> <li>...</li> <li>...</li> ... </ul> </div> ``` ##### 初始化插件 在页面DOM元素加载完毕之后，可以通过DDSort()方法来初始化插件。 ```html $( '#wrap' ).DDSort({ target: 'li', //拖拽的目标元素，默认即'li' floatStyle: { //拖拽元素的样式，默认有一定的样式 'border': '1px solid #ccc', 'background-color': '#fff' } }); ``` 如果拖放列表带有滚动条，那么$( '#wrap' )需要是这个带滚动条的元素。 ##### 配置参数 | 参数 | 类型 | 描述 | | ------------ | ------------ | ------------ | |target|string|可选，插件内部使用的是jQuery的on方法绑定的事件，此参数就是on方法上的选择器字符串，默认'li'| |cloneStyle|object|可选，设置占位符元素的样式| |floatStyle|object|可选，设置拖动元素的样式| |down|function|可选，鼠标按下时执行的函数| |move|function|可选，鼠标移动时执行的函数| |up|function|可选，鼠标抬起时执行的函数|
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告
