我怎样才能用CSS冻结THEAD？

我想冻结我的表的THEAD部分，从而为我滚动时，THEAD始终可见。在此FIDDLE 我怎样才能用CSS冻结THEAD？

2014-01-30 ciaoben

不能以'单独CSS'，因为它是造型，有没有办法来检测滚动位置，这就是为什么你需要JavaScript，以便检测时，有一定量的滚动。的[CSS-只滚动表与固定头] –

可能重复（http://stackoverflow.com/questions/11891065/css-only-scrollable-table-with-fixed-headers） – gpgekko

你能否解释它是什么，你要实现？我真的不明白你的意思是什么“每次我滚动时刷新标题” – AzDesign

的

$(".scroll").scroll(function() { 
    $("#header thead").css({"top": ($(".scroll").scrollTop()) + "px"}); 
});

你可以看到它在行动：我通过一个事件处理程序附加到jQuery中的scroll事件，设置THEAD到滚动的top位置偏移做到了这一点最丑陋的备用解决方案，至少没有js和大多数浏览器支持（无css3）。 Jsfiddle 基本上它是duplicate表中，设置第一个表头只在第二个表顶部可见。缺点是，因为它使用的是固定位置，所以不会像表格那样水平滚动。也许如果你将表格宽度设置为与窗口宽度相同，它应该可以正常工作。只是一个替代

来源

2014-01-30 15:02:01 AzDesign

TY的评论......但头部的这样的水平滚动似乎没有工作 – ciaoben

是的，它对浏览器窗口有固定的位置。尝试将js小提琴调整到更大的屏幕或重新调整表格的大小以适应浏览器窗口。我使用1920px宽度的显示器，如果我将jsfiddle窗口拉伸到最宽，所有数据都可以正常显示而不需要水平滚动 – AzDesign

是的，但是我需要当我在小显示器上看到时，它可以正确显示，即使水平溢出吧 – ciaoben

我怎样才能用CSS冻结THEAD？

回答

相关问题