JS实现table表格固定表头且表头随横向滚动而滚动详解

先看一张效果图

思路：

1、头部用一个table并用一个p包裹着， 表格的具体内容用一个table

2、头部外面的p用positon: relative相对定位

3、获取整个表格的高度

4、获取表格的dom（或者包裹着表格的dom）距离页面顶部的距离 offsetTop

5、滚动的零界点的距离 表格的高度+表格距离页面顶部的距离 如果滚动超过这个 就让头部的top值归0或原封不动

当然还有很多可以优化的地方 我只是展示一个小思路 嘿嘿嘿

题外话 为啥用红色表头 因为显眼哇 哈哈

JS代码

相关推荐：

jquery如何操作table表格各种方式实例汇总

html5中实现table表格中的斜线表头效果的5种做法

html中table表格的内容水平和垂直居中显示实例代码

以上就是JS实现table表格固定表头且表头随横向滚动而滚动详解的详细内容，更多请关注Gxl网其它相关文章！