您的位置:首页 > Web前端 > JQuery

调整Table表格宽度插件colResizable

2017-12-06 16:48 274 查看


调整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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息