Bootstrap HTML5 Sortable jQuery Plugin
Features
- Less than 1KB (minified and gzipped).
- Built using native HTML5 drag and drop API.
- Supports both list and grid style layouts.
- Works in IE 5.5+, Firefox 3.5+, Chrome 3+, Safari 3+ and, Opera 12+.
Usage
Use sortable
method to create a sortable list:
;
Use .sortable-dragging
and .sortable-placeholder
CSS selectors to change the styles of a dragging item and its placeholder respectively.
Use placeholderClass
option to create sortable lists with additional class for placeholder:
;
Use sortupdate
event if you want to do something when the order changes (e.g. storing the new order):
;
Use items
option to specifiy which items inside the element should be sortable:
;
Use handle
option to restrict drag start to the specified element:
;
Setting forcePlaceholderSize
option to true, forces the placeholder to have a height:
;
Use connectWith
option to create connected lists:
;
Use sortconnect
event if you want to do something when an item is moved between connected lists:
;
To remove the sortable functionality completely:
;
To disable the sortable temporarily:
;
To enable a disabled sortable:
;
License
Released under the MIT license.