使列宽相同的两个表

问题描述：

我想实现一个表结构，其中标题保持不动，当我向下滚动。为此我使用了两张桌子。第一个表具有标题值，第二个表具有相应的数据（每列中的数据长度可能随着数据动态填充而变化）。问题在于标题宽度和数据列宽度不完全匹配。我已经写了一些类似的代码如下所示动态地改变列宽使列宽相同的两个表

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

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

这不能工作，因为这parametres是最小宽度，有一种情况下，宽度可以在一些线条更大，这会影响所有其余的。 – Aristos 2012-02-15 12:11:21

是的..但你有什么想法如何解决这个问题？ – user1211259 2012-02-15 12:13:32

你只能在div里面放置div，向div表示div来剪切扩展它，或者类似的东西。在某些情况下，如果宽度小于数据宽度，很难使2个表格具有相同的宽度。如果你有一个在线页面，我可能会看到更多你的问题。 – Aristos 2012-02-15 12:15:52

答

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

答

创建工作捣鼓这个： http://jsfiddle.net/terjeto/dx7H5/

Offcourse如果你的情况是不同的，你可能需要调整痘痘。在我看来，有问题的地方是如果表格使用动态或％宽度并应对大约18px的“auto”滚动条，并且如果表格需要水平滚动条则会导致需要onscroll事件的litle事件变得复杂。

难道你的例子不准确，因为缺乏重置CSS代码？我使用这个：http://developer.yahoo.com/yui/reset/

但问题是当我调整窗口的大小，所有的调整变化...和当然，％宽度和“自动”滚动条的问题是 – user1211259 2012-02-15 12:49:06

好的。我知道了。猜猜这不是一个简单的答案。我的应用程序使用复杂的校准算法（onresize和onscroll）来确保表格单元与标题内联（www.symphonical.com）。但是这种技术在不同情况下各不相同。如果你用真实的内容和布局做一个例子，我可能会提供帮助。 – terjeto 2012-02-15 13:04:37

使列宽相同的两个表

相关推荐