javascript - 弹出框内显示table，如何固定表头？

Question

我的需求是：
当用户点击一个超链接时，在超链接的左边弹出一个框，里面显示一个表格，表格的数据是从后台拿过来的，当数据很多时，弹出框就会显示水平和纵向滚动条，用户希望能将表头固定在弹出框头部，这样，纵向滚动的时候可以清楚的看到当前是哪个列的值。水平滚动的时候，表头也应该跟着水平滚动。

总结一句话需求就是， 弹出框内显示表格，当数据多的时候，纵向滚动要求表头固定在弹出框顶部，水平滚动要求表头也跟着水平滚动。

我自己尝试着做了一下，表头固定在弹出框头部可以实现（用的position:fixed实现），但是现在就卡在水平滚动这块了，因为position:fixed相当于针对浏览器定位，所以设置width和overflow都不起作用，有没有人之前遇到过这种需求的麻烦给点思路，谢谢。

Answer 1

没有遇过这种需求。fixed不行的话可以换个思路，例如表头和表内容分离开，表头absolute固定，然后表内容去overflow试试看

Answer 2

问题解决了，不过有点问题。我是额外弄了个新表，里面只包含表头,对此快用的position:relative,然后监听弹出框的滚动事件，因为表头要一直定位在弹出框顶部，所以我这块采取的方法是监听弹出框的scroll事件，拿到scrollTop值然后重新定位表头那个区域。这样有一个缺点就是，要是用户滚动y轴比较慢的话，那么表头区域很明显可以看出跳动效果。还没有好思路解决这个现象。