分享 html 表格可固定标题和列 (也适用于移动客户端 )

爱意满满的作品展示区。

This topic created in 3835 days ago, the information mentioned may be changed or developed.

顺带求个在安卓上性能更好的这种表格.

在谷歌 ,android 4.1 ,微信 x5 , iphone 上效果很好，完全没有延迟，

Demo 地址:
http://maomaomao.coding.me/games/table2/example1.html

使用 jq:
http://maomaomao.coding.me/games/table2/example2.html

ps:导入怎么把 jquery 中的 windth 方法分类出来....

谷歌浏览器上的效果:
1.

UC 9.0 上标题行总是慢一点.
桌面版 firefox 上无法对齐.求大神找找为什么在火狐上不正常吧，谢谢!

3.火狐上的效果

完全一样的代码.前端好难做到兼容很多浏览器啊.求 v 站大神们帮帮....

5 replies • 2019-12-31 14:43:46 +08:00

qhxin

May 9, 2016

依赖 scroll 事件回调啊，有延迟的话，试试用定时器去刷新呢。

qhxin

May 9, 2016

至于对不齐，应该是盒模型没一致吧。边框宽度导致的。

maomaomao001

May 9, 2016 via Android

@qhxin 定时器刷新？段时间没不停的刷新？

sinosure

May 14, 2016

很好，挺有用的

maomaomao001

Dec 31, 2019

居然 css 已经有最好的方案了，sticky 定位

https://codesandbox.io/s/epic-tu-12rmy?fontsize=14&hidenavigation=1&theme=dark

<iframe
src="https://codesandbox.io/embed/epic-tu-12rmy?fontsize=14&hidenavigation=1&theme=dark"
style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;"
title="epic-tu-12rmy"
allow="geolocation; microphone; camera; midi; vr; accelerometer; gyroscope; payment; ambient-light-sensor; encrypted-media; usb"
sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"
></iframe>

分享 html 表格 可固定标题和列 (也适用于 移动客户端 )