网站建设案例完整代码,有没有做网站源代码 修改的,经典编辑器wordpress,免费网站模板带后台最近项目里面要实现需要实现一个拖拽功能,自己实现很麻烦,就在网上找到了一个封装好的sortable函数,github(https://github.com/SortableJS/Sortable).
首先是依赖的引入:(也可以自己下载源代码导入,方式很多呢)
body!-- Latest compiled and minified CSS --body!-- Latest compiled and minified CSS --link relstylesheet href//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css/!-- Latest Sortable --script srchttps://raw.githack.com/SortableJS/Sortable/master/Sortable.js/script
/body导入了依赖文件后,调用起来也十分方便.
// 只需在需要的在script中输入以下代码即可实现拖拽,排序功能.
body
div idsortTrue classlist-goupdiv classlist-group-itemfoo/divdiv classlist-group-itembar/divdiv classlist-group-itembaz/div
/div
div idsortFalse classlist-groupdiv classlist-group-itemqux/divdiv classlist-group-itemquux/div
/div
scriptSortable.create(‘sortTrue’{group: sorting,sort: true});Sortable.create(sortFalse, {group: sorting,sort: false});
/div
/body上述代码创建了2个list,可以把sortTrue内的元素拖拽到sortFalse里面(反之也成立),因为它们属于同一个分组(group:‘sorting’),区别在于, sortTrue内的元素可以在组内拖动排序(srot:true).srotFalse内的元素不允许拖动排序(sort:false).
还有很多有趣的功能,具体参考官方github:https://github.com/SortableJS/Sortable. 文档说明
