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

先看一张效果图

思路：

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

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

3、获取整个表格的高度

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

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

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

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

JS代码

以上所述是小编给大家介绍的JS实现table表格固定表头且表头随横向滚动而滚动，希望对大家有所帮助！！

相关推荐：

javascript判断用户有没有操作页面详解

JavaScript实现单击网页任意位置打开新窗口与关闭窗口的方法

使用JavaScript实现一个小程序之99乘法表

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