问题标签 [fixed-header-tables]

我正在将父页面中的数据表的副本加载到引导模式中，并首先在模式中更改表的 id。在此之后，我以不同方式初始化两个表的数据表。还使用数据表构造函数 FixedHeader() 固定标题。对于父窗口中的表格，同样的工作正常，而不是模式。模态中的表格具有正常的标题，并且在加载模态时，另一个固定标题正在加载到父窗口本身中。

需要解决方案来解决此问题。

我正在尝试创建一个粘性表头，但问题是，我无法让列的宽度与基表中列的宽度相匹配。

问题似乎是，无论我为表中的各个列设置（或未设置）的宽度如何，列的实际宽度有时会根据表中的内容而有很大差异。

我尝试了许多解决方案，迄今为止最成功的是将整个表格（包括 tbody）复制到固定位置 div 中，然后在固定位置 div 中设置表格的 tbody 部分的可见性到隐藏。

通过这样做，列宽是相同的，但问题是粘性表的 tbody 虽然不可见，但覆盖了主表，因此无法在主表上注册悬停状态等。

有没有人对如何正确制作在所有情况下都具有适当列宽的粘性表格标题有任何建议？谢谢你。

编辑：这是我的标记示例：

我为含糊而道歉，但我无法显示实际数据，因为它本质上是敏感的。关键是，数据多种多样，无论我做什么，我都无法让列宽固定/一致；他们不断地不同。

目前，在页面渲染时，我将整个表格复制到粘性 div 中，然后将 tbody 元素的可见性设置为hidden. 这给出了适当的宽度，但会导致主表被覆盖。在这种情况下，Z 索引似乎也无济于事。

我有一个使用 twitter bootstrap 设计的 html 表格，我使用此 fiddle中给出的Fixed TableRC插件将表格的标题行固定为固定。标题的宽度设置为

它适用于空白表。当我td在表格中添加一些值时，列的对齐方式略有改变，如本小提琴中给出的那样，在这种情况下也是. 我该如何解决这个问题？

我正在使用Adam Shaw 的 FullCalendar插件和资源视图集成。这就是我的 FullCalendar 的样子。

我想修复突出显示的区域，这样一直滚动到底部不会隐藏员工姓名。

我只想使该标题可滚动，直到它触及浏览器的顶部并在剩余的滚动时间内将其粘贴在那里。

以这种方式，即使我在使用日历的下部，我仍然知道与员工对应的列名，而无需上下滚动。

有没有人试过这个？有这方面的资源吗？

感谢任何帮助。非常感谢！

我在屏幕顶部有一个固定的标题，如果我尝试在标题之后放置一个元素，则所述元素最终会忽略标题的高度。

HTML

CSS

JSFIDDLE

我在 StackOverflow 和其他地方搜索过类似问题的解决方案，但无济于事（部分原因是我很难用语言表达具体问题）。我尝试了一个clearfix，

但这仍然行不通。我也尝试向元素添加 a margin-top: 100px，p但我认为在我将来更改标题的高度的情况下这是不好的做法，并且还必须对标题后面的每个元素或我可能添加的任何其他元素执行此操作一个position: fixed或position: absolute。此外，标题将根据不同尺寸的屏幕具有流体高度。

现在我正在制作线框图，所以如果可能的话，我真的宁愿不使用 JavaScript，而只使用纯 CSS。如果不是，最小的香草 javascript 就可以了。这是一个基本的网页设计问题，我一直用它来反驳它，margin-top但我想知道是否有人知道一种更清洁、更好的方法来对付它。

此外，这至少需要跨浏览器。同样，只有线框图。我的线框应该能够处理任何支持基本 CSS 的东西。

抱歉，如果这是一个重复的问题，我敢肯定，但我找不到任何与我的情况完全匹配的东西。任何帮助深表感谢！

我正在使用 jQuery fixedheadertable 插件。该插件允许用户在向下滚动表格时拥有一个固定的标题，该标题保持在静态位置。但是，我的问题更像是一个一般的 js 问题。

这是我初始化插件的代码：

基本上，我的问题是，对于我的表，列数会根据用户选择的偏好而改变。一旦该数字发生变化，我们必须重新运行此函数以使表格正确显示。主要思想是 var 'colratioString' 中的值必须与表中的列数相同。这些数字（例如：150）可以设置为我们想要的任何值，但为了简单起见，我现在将它们全部设置为 150。

我试图克服的障碍是有时我可能需要 colratioString 看起来像这样：

有时我可能需要它看起来像这样

等等。

有什么方法可以获取 colCnt 值（这是我将拥有的正确列数），并创建一个具有正确数量值的 colratioString？

这是一个例子。如果...

然后

我无法获取 colCnt 的值，并创建一个包含我需要的确切格式的 colratioString 变量。

感谢您的阅读！

这是场景。我有一个填充滚动数据的表格。它包含大量行。并且在每个滚动宽度上th动态变化。该表是用knockoutjs. 请在下面找到th.

的文本th包含在 a 中div。类headerCell和headerText如下：

现在这里th仍然存在fixed，但ths 与tdof不一致tbody。有时它对齐，有时它不对齐。这在 Firefox 中可以正常工作。问题出现在 chrome 浏览器中。

我也尝试使用jquery插件修复它，但它们都不起作用。

动态分配th宽度时如何解决更改其位置的问题？th

我有一个固定的表格标题脚本，它可以完全按照我的需要工作，除非表格比窗口宽并且页面上正在加载 twitter bootstrap 3 css并且正在使用 IE 或 Firefox 查看页面。

twitter bootstrap 3 会改变这种行为的原因是什么？这是我此时所拥有的jsfiddle

我正在为角度数据表使用固定标题属性，代码如下所示

滚动时表格的标题固定在页面顶部，一切正常。但是我遇到了数据表的标题列和正文列之间的列对齐问题。

所以我尝试了http://bobcravens.com/2010/01/html-scrolling-table-with-fixed-headers-jquery-plugin/中描述的解决方案，但结果保持不变。

我不明白为什么会这样。所以我在调用固定标头功能时给出了一些超时new $.fn.dataTable.FixedHeader($scope.table);。但结果再次保持不变。

任何机构都面临同样的问题？

我尝试了各种结果，但通常大多数地方我都得到了水平固定标题。

但我正在使用 bootstrap 2 并希望制作一个具有各种动态列的表，因此请修复前 3 列以用作表的垂直标题。

正如我尝试过的那样http://www.fixedheadertable.com/

我已经尝试过：

但是它垂直克隆了带有标题但不固定的表格，以及UI与原始设计的上下像素中断。

但它把我的桌子弄乱了。有人可以帮忙吗？

图片寻求帮助：

我在这里有一个小提琴：jsfiddle.net/tysewu52