jQuery，鼠标可控制列宽的大小（colResizable.js）

最新推荐文章于 2024-03-15 09:35:51 发布

吕化冬

最新推荐文章于 2024-03-15 09:35:51 发布

阅读量1.9k

点赞数 2

分类专栏： jQuery插件文章标签： jQuery鼠标可控制表格列宽鼠标可拖动表格列宽

本文链接：https://blog.csdn.net/weixin_40656367/article/details/82908806

版权

1 篇文章 0 订阅

订阅专栏

首先colResizable是一款轻量级，可调整表格列宽的jQuery插件。大小只有几KB。

此插件是基于jQuery的一款轻量级插件，所以，在使用过程中，必须在引入jQuery之后使用。

<head>
	<script src="js/jquery-1.10.2.js"></script>
	<script src="js/colResizable.js"></script>
</head>

调用时：

$('table').colResizable();

这里colResizable()有一个参数：resizeMode。它带有两个属性：

1、flex：如果父容器中有足够的空间，表可以更改其宽度，并且每列可以单独收缩或扩展。如果没有足够的空间，列将在调整大小时共享其宽度。表永远不会比其父级更大。

$("table").colResizable({resizeMode: 'flex'});

2、overflow：如果表的宽度超出父元素的宽度，父元素会出现滚动条。

$("table").colResizable({resizeMode: 'overflow'});

好了，暂时就说这么多，还有很多的参数、属性和示例，请参看colResizable的外文文档进行学习。

关注

专栏目录