调整Table表格宽度插件colResizable

调整Table表格宽度插件colResizable

引入JS

<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script><script src="js/colResizable-1.6.js" type="text/javascript"></script>
1
2

TABLE

<table class="table table-bordered"><thead>    <tr>       <th>栏目类型</th>       <th>活动名称</th>       <th>状态</th>       <th>操作选项</th>    </tr></thead><tbody>    <tr>       <td>青春日记</td>       <td>我们一起傻逼的日子</td>       <td>提交</td>       <td>审核</td>    </tr>    <tr>       <td>我和孩子的成长故事</td>       <td>成长故事</td>       <td>通过</td>       <td>审核</td>    </tr></tbody></table>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

JS

<script type="text/javascript">    $(function() {        $("table").colResizable();    })</script>
1
2
3
4
5

以上步骤即可实现最简单的鼠标拖动调整表格列宽

在线演示：colresizable

 colResizable 官方文档：http://www.bacubacu.com/colresizable/

原文地址： http://blog.csdn.net/itmyhome1990/article/details/51322740