中国最全IT社区平台 联系我们 | 收藏本站
华晨云阿里云优惠2

Jquery集合

浏览声明

UI

分类插件

模态框

滚动轮播

拖拉排序

多选框

滚动条

Loading

移动端

提示框

功能性插件

瀑布流

  • CSS3立方体小照片
  • D3.js logo可视化库 D3.js
  • 图片处理

    banner特效

    一个轻简的jQuery拖放排序插件DDSort

    阅读 (2167)
    ie兼容6
    插件描述:jQuery任意拖动页面中元素代码

    使用方法:

    1、假设Html结构如下:

    <div id="wrap">
        <ul>
            <li>...</li>
            <li>...</li>
            ...
        </ul>
    </div>

    2、依次引入jquery.js和ddsort.js,然后使用DDSort API实现如图拖放排序效果:

    $( '#wrap' ).DDSort({
        target: 'li',           //示例而用,默认即'li'
        floatStyle: {           //示例二用,默认有一定的样式
            'border''1px solid #ccc',
            'background-color''#fff'
        }
    });

    3、如果拖放列表带有滚动条,那么$( '#wrap' )要是这个滚动条的元素。

    详细API

    DDSort方法接受一个JSON对象类型的参数,以下是对这个参数的描述。

    参数列表类型描述
    target string可选,插件内部使用的是jQuery的on方法绑定的事件,此参数就是on方法上的选择器字符串,默认'li'
    cloneStyleobject可选,设置占位符元素的样式
    floatStyleobject可选,设置拖动元素的样式
    downfunction鼠标按下时执行的函数
    movefunction可选,鼠标移动时执行的函数
    upfunction可选,鼠标抬起时执行的函数

    关闭
    程序员人生