现在的位置: 首页 > 综合 > 正文

Jquery colResizable 插件 可拖动表格的宽度

2013年09月07日 ⁄ 综合 ⁄ 共 940字 ⁄ 字号 评论关闭

使用方法:官方网站:http://quocity.com/colresizable

Usage
To use this plugin a script reference must be added to the colResizable.min.js file in the head section of the document once jQuery is loaded. To enhance a table (or collection of tables) point it with a jQuery wrapper and apply the colResizable() method. 
Resizing grips will be located in the table according to its first row layout. For this reason, it is not recommended using colspan values in those cells. If colspan in the first row is required, just add an extra row before your table heading with no height
so it won't be visible. 
In order to prevent strange behaviors while resizing a column, you are highly encouraged to define the width of the table, either by using its width attribute, an inline style, or a css rule. 

<head>
  <script src="js/jquery.js"></script>
  <script src="js/colResizable.min.js"></script>
</head>
<body>	 
  <table width="100%" >
    <tr> <th> header </th> <th> header </th> </tr>
    <tr> <td> cell </td> <td> cell </td> </tr>							
    <tr> <td> cell </td> <td> cell </td> </tr>							
  </table>	
</body>
$(function(){
  $("table").colResizable();
});

就这么简单!

抱歉!评论已关闭.