化妆位置固定航向甚至滚动

Question

后，我有一个表有垂直滚动条

<div id="div_data" style="top: 7px;"> 
<table id="data" cellspacing="0" cellpadding="0"> 
      <thead> 
       <tr class="fix"><td class="newClass"> <div> Algebra </div></td> 
        <td class="newClass"><div> Geometry</div></td> 
        <td class="newClass"><div> Theorems</div></td> 
        <td class="newClass"><div> Comment</div></td> 
        </tr> 
      </thead> 
      <tbody style="overflow:auto; height:100px;"> 
      ...................... 
      </tbody> 

    </table> 
     <table id="header-fixed" cellspacing="0" cellpadding="0"></table> 
    </div>  

当我滚动#data table，我需要做的表格标题元素是固定不scrolling.For那我已经做了以下的jquery代码：

var tableOffset = $("#data").offset().top; 
var $header = $("#data > thead").clone(); 
var $fixedHeader = $("#header-fixed").append($header); 
    $("#div_data").scroll(function(){ 
     $('#div_row_headers').scrollTop($('#div_data').scrollTop()); 
     var offset = $(this).scrollTop(); 

     if (offset >= tableOffset && $fixedHeader.is(":hidden")) { 
      $fixedHeader.show(); 
     } 
     else if (offset < tableOffset) { 
      $fixedHeader.hide(); 
     } 
    }); 

第一表的元素中的内容被克隆第二表内，但#header-fixed台的位置是未在所述第一table.It的标题区域来到桌子中间。我只是想塞给它在 #data table。我的CSS元素的位置如下：

#header-fixed { 
position: fixed; 
display:none; 
background-color:white; 
} 
table#header-fixed tr td { 
    width: 155px; 
}  
table#header-fixed tr td div { 
    width: 155px; 
    float: left; 
    text-align: center; 
} 

编辑：当我滚动窗口滚动条，新表是固定的，我需要滚动表格，当我滚动窗口滚动条时

Answer 1

你唯一需要做的是用tbody标签包装你的表体。并将以下CSS应用于该标签。

tbody { 
    display: block; 
    height: 100px; 
    overflow: auto;   
    width: 100%; 
}