300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > JQuery实现的Table表头固定展示效果

JQuery实现的Table表头固定展示效果

时间:2023-08-09 12:28:31

相关推荐

JQuery实现的Table表头固定展示效果

在线演示1在线演示2在线演示3本地下载

大家可能经常需要展示数据或者报表,表头如果滚动上去后,查看数据的类别和字段是个麻烦事情,在这里我们推荐来自tympanus的一个JS实现的 table表头固定效果,相信大家肯定会受益的,这个demo使用了jQuery来实现,所以能够很好的支持各种浏览器上的报表展示!

这里有两点值得大家讨论:

为什么不使用position:fixed来实现表头固定

使用fixed的好处在于:

无需计算滚动中的偏移,而使用JS需要自己处理没有滚动响应的延迟,效果可能更好

但是fixed有一个非常重要的缺点:

如果你的table宽度超出了容器,那么水平的overflow需要设置,但是这个时候,你会发现fixed的表头不会再滚动了,应为它已经脱离了文档的布局,这就是为什么有这么多的开源的表头固定处理JS

转载:/gb/share/2712.htm

原文:/codrops//01/09/sticky-table-headers-columns/

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。