我正在尝试创建一个类似于 Google Docs 电子表格或 Excel 的电子表格,其中您有一个充满数据的表格。当我垂直滚动时,第一行保持固定,当用户水平滚动时,第一列保持固定,我该怎么做?我不是在寻找插件,这是如何使用 HTML/CSS 完成的?我一直在查看 Google Docs 电子表格的代码,但无法确定解决方案。有人可以为此提供一个简单的例子吗?
例如:
jsFiddle:http://jsfiddle.net/tYUwd/2/
在 jsFiddle 中,当您水平滚动时,我希望固定 .row-header
元素。当您垂直滚动时,.column-headers
将被修复。
最佳答案
我相当确定目前仅使用 HTML/CSS 无法做到这一点。你可以只用 HTMl/CSS 做一个固定的标题或一个伪固定的第一列,但你需要 JavaScript 来让两者一起工作。我建议查看此站点:http://www.8164.org/the-big-table-issue/
我还建议检查这两种可能的解决方案: http://cross-browser.com/x/examples/xtable.php http://www.disconova.com/open_source/files/freezepanes.htm
我以前使用过卡住 Pane 解决方案,效果很好。
关于HTML 电子表格固定标题和最左边的列,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7618595/