Mootools 1.2教程(16)——排序类和方法简介（2）

Sortables选项

如果你想完全定义你自己的sortable列表，你就需要使用这些选项。

constrain

默认——false

这个选项决定了你的sortable列表元素是否可以在多个ul之间拖动。

例如，如果你在一个sortable对象中有两个ul，你可以通过设置选项“constain:true”来“限制”（constrain）列表的元素只允许在它们的父节点ul之内移动。

参考代码： 

var sortableLists = new Sortables(sortableListsArray, { 
    constrain: false // 默认为false 
});

clone

默认——false

克隆（clone）选项允许你添加一个“clone”的元素跟随你的鼠标移动，而把原始的元素留在原地不动。你可以从下面的例子中看看如何使用clone选项：

参考代码： 

var sortableLists = new Sortables(sortableListsArray, { 
    clone: true // 默认为false 
});

handle

默认——false
handler选项可以接受一个元素作为拖动的控制器。如果你要保持你的列表中的文本可以被选中或者保留li的其他行为，使用这个参数则非常方便。默认参数为false则会使得整个元素（li）成为控制器。

参考代码： 

var handleElements = $$('.handlesClass'); 
var sortableLists = new Sortables(sortableListsArray, { 
    handle: handleElements // 默认为false 
});

opacity

默认——1

不透明度（opacity）选项可以让你调整排序元素。如果你使用了一个clone的副本，opacity将作用于这个排序元素，而不是更随你鼠标的那个副本。

参考代码： 

var sortableLists = new Sortables(sortableListsArray, { 
    opacity: 1 // 默认为1 
});

revert

默认——false

复原（revert）参数可以接受“false”或者Fx的选项值。如果你给revert参数设置了Fx的选项，那么当元素放置到一个位置时会应用相应的Fx设置。例如，你可以设置“duration:long”，那么当你松开鼠标时，那个克隆的对象将会在这个时间之内返回到它的位置。如果要看revert的效果，可以看看下面的例子：

参考代码： 

var sortableLists = new Sortables(sortableListsArray, { 
    revert: false // 默认为false 
}); 

// 你也可以设置为Fx选项 
var sortableLists = new Sortables(sortableListsArray, { 
    revert: { 
        duration: 50 
    } 
});

snap

默认——4

snap参数允许你设置鼠标必需拖动了多少个像素之后，元素才会被拖动。

参考代码： 

var sortableLists = new Sortables(sortableListsArray, { 
    snap: 10 // 用户需要拖动10px来开始拖动这个拖动列表 
});