README

jquery.floatThead

文档与示例： http://mkoryak.github.io/floatThead/

在滚动时浮动表格头部。无需修改您的HTML/CSS，即可正常工作。支持在窗口内或容器内滚动时浮动头部。支持响应式表格。

安装

包管理器

npm install floatthead
bower install floatThead

下载代码

最新版本（zip）

通过CDN

https://cdnjs.com/libraries/floatthead/
https://www.jsdelivr.com/#!jquery.floatthead
https://unpkg.com/floatthead

<!-- Latest compiled and minified JavaScript -->
<script src="https://unpkg.com/floatthead"></script>
<script>
  $(() => $('table').floatThead());
</script>

针对Java开发者

Webjar

包装器

vuejs 组件 by @tmlee

angularjs 指令 by @brandon-barker

yii2 框架包装器 by @bluezed

此插件的功能

• 在大型公司和开源项目中生产环境中使用。维护中。查看开放问题。
• 在可滚动的容器或整个窗口滚动时工作
• 与响应式表格包装器一起工作
• 与动态隐藏/添加/删除列一起工作
• 不会克隆thead - 因此您的事件仍然绑定
• 做position:fixed无法做到的事情（以及不支持它的浏览器）
• 不会干扰您的样式，并且不需要任何CSS（参见fixed与absolute位置模式）
• 与border-collapse变体、奇特的边距、填充和边框一起工作
• 与如datatables、perfect-scrollbar、bootstrap3等库一起工作，还有更多
• 可以使用position:absolute浮动头部，这会添加一个包装器，或者使用position:fixed，它不会添加。两者都有其优缺点。默认情况下，根据您的配置选择最佳选项

此插件不执行的操作

• 不会浮动页脚
• 不会让您像在Excel中那样锁定第一列
• 不支持Safari和移动Safari。它可能工作，也可能不工作，这取决于您的标记和Safari版本。可能不工作。
• 不支持RTL - 如果您幸运的话，在溢出滚动中可能工作得更好。期望在html元素上存在dir。
• 不支持由文档缩放不是100%导致的布局问题。

常见陷阱

如果您遵循css和html的最佳实践，此插件将正常工作。如果您还停留在1999年，您最好阅读FAQ。

如何获得floatThead的帮助？

所有问题应通过github报告。咖啡/啤酒捐赠受欢迎 ;)

需求

• jQuery 1.8.x或更高版本（1.9兼容）（或jQuery 1.7.x和jQuery UI核心）

支持的浏览器

• IE8或更高版本（必须阅读 此内容针对任何Internet Exploder集成）
• Chrome，Firefox（过去3年的所有版本）

变更日志

查看CHANGELOG.md

谁在使用floatThead？

Ctrl O

• Ctrl O提供简单创新的产品，帮助组织的业务流程。其旗舰产品Linkspace，帮助团队和个人以简单有效的方式共享信息。

WheresTheGig.com

• 音乐社区的自由服务

Google

• 内部，我恰好知道...

Samsung

• 为物联网！

兼容性表格

• https://github.com/kangax/compat-table/blob/gh-pages/jquery.floatThead.min.js
• 在线网站（在此处查看floatThead的实际操作）

在github代码搜索中有约135,000次点击

许可

MIT