Question

我正在尝试实现一种表格结构，当我向下滚动时标题保持固定。我为此目的使用了2个表。第一个表具有标题值，第二个表具有相应的数据（每列中的数据长度可能随着数据的动态填充而变化）。问题是标题宽度和数据列宽度不完全匹配。我编写了一些如下所示的代码来动态改变列宽

$('#tdCheckAllBody').width($('#tdCheckAllHead').width());
$('#tdLoginBody').width($('#tdLoginHead').width());
$('#tdStatusBody').width($('#tdStatusHead').width());
$('#tdFNameBody').width($('#tdFNameHead').width());
$('#tdLNameBody').width($('#tdLNameHead').width());
$('#tdCompBody').width($('#tdCompHead').width());

但它似乎没有正常工作。任何帮助表示赞赏。

Answer 1

使用此方法 $(window).scroll(function(){ $("#id of the table header").offset({top:$("#id of the control which u placed the scrolling").scrollTop()}); });

Answer 2

为此创造了一个工作小提琴： http://jsfiddle.net/terjeto/dx7H5/

如果你的情况不同，你可能需要调整一下。在我看来，有问题的区域是如果表使用动态或％宽度并且处理占用大约18px的“自动”滚动条，并且如果表需要水平滚动条，它会使需要onscroll事件的litle变得复杂。

由于缺少reset-css代码，你的例子是不是很准确？我用这个：http://developer.yahoo.com/yui/reset/

使2个表的列宽相同

2 个答案: