jquery - 固定表头与排序

Question

好的，我得到了 scroller tablesorter 的小部件工作，但它弄乱了我的表的标题大小。起初，我以为这是用于 complex sorting 的一些额外代码那是导致问题的原因，但我删除了所有额外的代码，但仍然遇到问题。

然后我想，也许是我的样式，所以我清除了所有内容可以只用边框替换它以使问题可见。

td, th {
 border: 1px #000 solid;
}

.th-inner {
 position: absolute;
 top: 0;
 line-height: 28px; /* height of header */
}

当仍然没有发现问题时，我开始缩短 tablesorter() 的执行时间，直到除了调用小部件之外什么都没有。

这是带有我的 CSS 的 JSFiddle，但没有用于复杂排序的额外代码:http://jsfiddle.net/Lv19a465/

这是只有边框的 CSS 的 JSFiddle:http://jsfiddle.net/Lv19a465/2/

所有迹象都表明有一个边距设置搞砸了，但我在控制台中找不到任何东西，也没有将它设置为 0 似乎对所有内容都有影响。

table, tr, td, th {
 padding: 0 !important;
 margin: 0 !important;
}

关于我遗漏的任何想法？

Answer 1

您需要将附加参数添加到您的 tablesorter 配置中才能正确显示。

$(function(){
 $('#mainlist').tablesorter({
     widgets: [ 'scroller' ],
     headerTemplate : '{content} {icon}'
     widthFixed : true,
 });
});

参见 http://jsfiddle.net/Lv19a465/5/