顶部行和左侧列冻结的可滚动HTML表格

有没有人能够在HTML中实现可滚动表格，其中TOP行和LEFT列被冻结，但表格的其余部分是可滚动的？一个完美的例子是： Google Squared 顶部行和左侧列冻结的可滚动HTML表格

我试图逆向工程的谷歌平方表的代码，但我一直没有成功到目前为止。

注意：我需要能够同时冻结TOP ROW和LIVT COLUMN。

来源

2009-07-08 Jon

链接已损坏。你能提供一个新的，因为我真的很好奇这个表的实用价值。 – 2014-07-04 11:06:15

有在http://ajaxian.com/archives/freeze-pane-functionality工作的例子，应该是很容易复制。请务必记下这些评论 - 许多用户为改进脚本提供了有用的建议。

根据@Nirk的要求，与活动演示的直接链接是http://www.disconova.com/open_source/files/freezepanes.htm。

来源

2009-07-08 23:06:07 anschauung

有没有人找到更好的方法来做到这一点？我正在处理一些巨大的数据集，因此这些表格包含大量的数据，将这些数据克隆到4次只是简单地不起作用。 jQuery是否有任何方法来达到同样的目的？ – 2009-10-16 20:48:22

-1

如果你使用jQuery，有很多用于固定表头的表格插件。

来源

2009-07-08 22:25:09 usoban

去与像这个 -

table 
    row 
    column (blank) 
    column 
     table (1 row high, column headers) 
    row 
    column 
     table (1 column wide, row headers) 
    column 
     div (fixed height & width, overflow auto) 
     table (actual data)

设定一个固定的表格布局的基本结构，并明确指定像素列宽。你应该能够达到同样的效果。

来源

2009-07-08 22:39:48

如果您想让单元格内容确定单元格的大小（即使用默认的表格布局），该怎么办？ – allyourcode 2010-03-13 15:40:49

-1

你需要Scrollable（jQuery插件）

Demo is here

来源

2009-07-08 22:57:01 Thinker

演示在我的浏览器中被刷新（chrome） – tfwright 2010-12-14 08:58:46

我有一个使用的版本（甘特图样式显示）。

它使用3个表格：左列（行）为1，上列（列）为1，然后是数据。

您需要努力使单元匹配尺寸与匹配尺寸（ table layout-fixed可以帮助实现此目的）。

然后将表格放在一些div中;左和顶部div（如上建议）高度&宽度和overflow-auto在他们的CSS。

然后，您挂钩一些JavaScript与内一个同步的左/顶部的div的滚动...

我记得有的“诅咒和尝试，再次”公平一点，但可以用最少的js来完成。

hth

来源

2009-08-22 09:07:48 realcals

顶部行和左侧列冻结的可滚动HTML表格

回答

相关问题