自定义配置页面信息块时对于jqueryUI中sortable的应

需求描述：左右相互拖动对信息块进行增删，信息块有标准宽度和两倍宽度的区分，并且整体宽度可自适应屏幕缩放；

需求简单演示图：

功能开发：

html:

其中：title 作为获取拖拽增删排序后的获取顺序数据的值，也可以写id或其他自定义属性

            class="two"  为区分一倍、两倍宽度的样式及标识控制

css：

仅供参考

js：

首先引入js文件

注意jqueryUI的版本

js代码：

注：结合需求写js部分，jqueryUI sortable.js的更多用法请参考：

        http://www.runoob.com/jqueryui/example-sortable.html

        https://blog.csdn.net/xpsharp/article/details/6906228   (参数讲解)

最终完成页面：