控件官方地址:http://www.bacubacu.com/colresizable/?utm_source=jquer.in&utm_medium=website&utm_campaign=content-curation#samples

使用【colResizable】第三方插件

使用方法:

<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> <script>
$(function(){
$("table").colResizable();
});
</script>

属性或方法:

【模式】resizeMode:[type: string] [default: 'fit'] [version: 1.6] [values: 'fit', 'flex', 'overflow']

【禁止】disable:[type: boolean] [default: false] [version: 1.0]

【禁止的列】disabledColumns:[type: array of int] [default: [ ] ] [version: 1.6]

【激活的拖拽】liveDrag:[type: boolean] [default: false] [version: 1.0]

【是否支持缓存】postbackSafe:[type: boolean] [default: false] [version: 1.3]

(如果是低版本的IE需要加上 sessionStorage.js 才能生效,如:IE7 and IE8)

【局部刷新(ajax)】partialRefresh:[type: boolean] [default: false] [version: 1.5]

【列高与第一行相同】headerOnly:[type: boolean] [default: false] [version: 1.2]

【设置抓钩的html】innerGripHtml:[type: string] [default: empty string] [version: 1.0]

【托转的样式】draggingClass:[type: string] [default: internal css class] [version: 1.0]

【定义最小宽度】minWidth:[type: number] [default: 15] [version: 1.1]

【活动手势】hoverCursor:[type: string] [default: "e-resize"] [version: 1.3]

【拖拽的手势】dragCursor:[type: string] [default: "e-resize"] [version: 1.3]

【冲刷(只有动态刷新时生效)】flush:[type: boolean] [default: false] [version: 1.3]

【左margin】marginLeft:[type: string / null] [default: null] [version: 1.3]

【右margin】marginRight:[type: string / null] [default: null] [version: 1.3]

【修正】fixed:[DEPRECATED: use resizeMode instead] [type: boolean] [default: true] [version: 1.5 only]

【==事件==】

【拖动时触发】onResize:[type: callback function] [default: null] [version: 1.0]

【拖动后触发】onDrag:[type: callback function] [default: null] [version: 1.1]

jquery-能拖拽宽度的table的更多相关文章

  1. jQuery可拖拽3D万花筒旋转特效

    这是一个使用了CSS3立体效果的强大特效,本特效使用jQuery跟CSS3 transform来实现在用户鼠标按下拖动时,环形图片墙可以跟随鼠标进行3D旋转动画. 效果体验:http://hovert ...

  2. jQuery可拖拽排序列表jquery-sortable-lists

    jquery-sortable-lists可以通过鼠标进行拖动排列树型菜单,可以定义某个列表元素是否拖动,拖动后回调,点击可以折叠树型结点,可以用来在后台模仿wordpress后台拖动菜单,实现多级菜 ...

  3. jquery实现拖拽以及jquery监听事件的写法

    很久之前写了一个jquery3D楼盘在线选择,这么一个插件,插件很简单,因为后期项目中没有实际用到,因此,有些地方不是很完善,后面也懒得再进行修改维护了.最近放到github上面,但是也少有人问津及s ...

  4. jquery sortTable拖拽排序

    所有的事件回调函数都有两个参数:event和ui,浏览器自有event对象,和经过封装的ui对象   ui.helper - 表示sortable元素的JQuery对象,通常是当前元素的克隆对象   ...

  5. jQuery 鼠标拖拽排序

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  6. SpringMvc+jQuery 文件拖拽上传、选择上传

    最近做了个简易的基于boostrap的文件上传功能,jsp版本的,后续会完善更多的功能,不过现在已经能用了,需要的小伙伴,直接引用下面的文件内容直接copy到自己的项目中就ok了,效果如图: file ...

  7. 面向对象+jquery实现拖拽功能

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. JQuery之拖拽插件

    一直以来,都对JS获取元素的位置感到非常的困惑:一会client.一会offset.一会scroll. 再加上各大浏览器之间的不兼容,唉,搞得哥晕晕乎乎的. 而很多页面效果都要用到这些位置.不得已,得 ...

  9. jquery 可拖拽的窗体控件实现代码

    引入JQUERY框架.把这个控件代码放到一个js文件里面直接引入就可以了控件代码 $.fn.myDrag = function() { var self = $(this); self.css(&qu ...

随机推荐

  1. java学习--自定义类的实例的大小比较和排序

    我们知道Object类有一个equals方法,用于比较两个对象是否相等 我们只要在自定义类中重写了equals方法(若不重写就是比较两个实例的地址,相当于==)就可以用来比较该类的两个实例是否相等 问 ...

  2. board_key.h/board_key.c

    /******************************************************************************* Filename: board_key ...

  3. mysql学习二、SQL常用数据类型

    一.常用数据类型 二.选择数据类型的原则: 1 业务需要 2 满足第一个条件下,需要存储空间最小的. 三.常用的选择数据类型思路:

  4. 团队作业6—《Spring_Four》团队项目系统设计改进与详细设计

    一.修改完善团队项目系统设计说明书 a.分析<考信项目系统设计说明书>初稿的不足:数据库建模不足 b. 团队项目Github仓库中更新:https://github.com/gzyt/SR ...

  5. nginx入门之编译安装

    nginx是什么 nginx是一个开源的,支持高性能,高并发的www服务和代理服务软件.它是一个俄罗斯人lgor sysoev开发的,作者将源代码开源出来供全球使用. nginx比它大哥apache性 ...

  6. (九)random、os、time、datetime、hashlib、pymysql、excel、sys、string相关模块

    1.random模块 1 import random,string 2 print(string.printable) #代表所有的 数字+字母+特殊字符 3 4 print(random.randi ...

  7. 消息中间件 rabbitMQ

    参考内容:https://www.cnblogs.com/dwlsxj/p/RabbitMQ.html 一.什么是RabbitMQ RabbitMQ是一个由erlang 开发的AMQP(Advance ...

  8. ThinkPHP3.2 --- 中文乱码问题

    在thinkphp中初次运行时 会出现中文乱码问题,解决方法也很简单 只需要在入口文件index.php加上这段代码即可: <?php header("Content-Type: te ...

  9. [Spring实战笔记]4面向切面编程的Spring-代理

    代理 代理(Proxy)是一种设计模式,可以在目标对象实现的基础上,扩展目标对象的功能. 代理对象是对目标对象的扩展,并会调用目标对象. 三种代理模式 静态代理 100% 代理对象与目标对象要实现相同 ...

  10. c#: TextBox添加水印效果(PlaceHolderText)

    基于他人代码修改,不闪,以做备忘. 与SendMessage EM_SETCUEBANNER消息相比,它能改变字体绘制颜色,EM_SETCUEBANNER只限定了DimGray颜色,太深 //与Sen ...