领带DIV元素溢出滚动条

我想创建一个datagrid表，这将允许我修复标题。我已将表格放置在两个DIV元素内，并固定了表格的THEAD部分。我动态地填充表格，并且可以有不同数量的列，并且每次都可以有不同的宽度。领带DIV元素溢出滚动条

<DIV style="position: relative; width="500px"> 
<DIV style="height:105px; overflow: auto;"> 
    <TABLE width="502px"> 
    <THEAD> 
     <TR style="left:-1px;top: 0;position: absolute;"> 
     ... header content ... 
     </TR> 
    </THEAD> 
    <TBODY> 
     ... data columns ... 
    </TBODY> 
    </TABLE> 
</DIV> 
</DIV>

该解决方案适用于垂直溢出。但是，我正在努力解决水平溢出问题。因为我修复了THEADs TR元素，所以如果我的表格超过了DIV宽度，就会出现水平滚动条，并且我可以水平滚动数据，但是标题是静态的并且不滚动。

我在想，如果我能得到动态创建的滚动条的id /名称，我可能能够以某种方式使用jquery滚动表头，但我不知道这是正确的解决方案还是如果它是甚至可能。

请提前告知并提前致谢。

来源

2012-07-19 NEW2WEB

有没有必要使用jQuery，你可以使用css'position：fixed'。 – undefined 2012-07-19 23:31:38

对不起，我不得不更新这个问题（我最初混淆了我的垂直线和水平线） – NEW2WEB 2012-07-19 23:40:18

@Raminson - 我尝试了'position：fixed'建议，但这并没有奏效（这可能是因为它是对早期问题的回应垂直/水平反转 – NEW2WEB 2012-07-19 23:43:18

许多人试图使用html和css制作表格的固定标题和左列，在滚动时保持放置状态，不幸的是它不起作用。

您唯一的选择是使用javascript来滚动表格来操纵表格。我没有特定的代码推荐，但做一些谷歌搜索。

来源

2012-07-19 23:41:50 Ariel

由于我找到的解决方案（这里是http://pics.cssbakery.com/treats/scrollingtable/tableTest6.php），保持放置似乎是很容易的部分，它是水平滚动和移动这是我的问题头文件TR。 – NEW2WEB 2012-07-19 23:47:18

@ NEW2WEB我知道，就像我说的 - 它不能在纯HTML/CSS中完成，如果你需要它，你还需要使用javascript。 – Ariel 2012-07-20 00:22:32

谢谢，但这就是我我不需要它是纯粹的CSS/HTML，所以你有什么样的例子吗？ – NEW2WEB 2012-07-24 17:31:47

领带DIV元素溢出滚动条

回答

相关问题