我想用表体数据滚动固定表头？

Question

我的表中有多列。我修复了表头工作正常。但是当我水平滚动桌子主体柱时，头部不会随之移动。它只是修复了。如何解决这个问题。

这是小提琴       <a href="https://jsfiddle.net/waseemak/mpy2ejbm/">Example</a>

Answer 1

您已设置position:fixed css，因此如果您将其删除，则可以看到标题滚动以及所有列。

fixed_thead.css({
    //'position': 'fixed',    // I have commented this out
    'top': 0,
    'background-color' : 'white',
    'height': '160px',
    'overflow': 'hidden'
});

其他解决方案在此处： https://jsfiddle.net/5fqLhc37/

我已将以下代码段添加到您的JS代码中：我已将class="scroller"附加到div。您可以在jsfiddle中检查这些更改。

$('.scroller').scroll(function ()
{
    console.log($(this).scrollLeft);
    fixed_thead.offset({ left: -1*this.scrollLeft });
});