滚动另一个DIV时如何滚动DIV

Question

我的HTML，angular-4-data-table分成2个div来显示固定的标题。我的数据有更多列显示 主体div的水平滚动条。现在，当我滚动主体的水平滚动时，我也想滚动标题div以使其同步。我该怎么做到。

<div class="data-table-box" [ngClass]="styles1">
<table class="table table-condensed table-bordered data-table">
            <thead >
                <tr>
                </tr>
            </thead>
</table>
</div>
<div style="overflow:auto;position: relative; top: -21px; left: 0;" [ngClass]="styles2"> 
            <table class="table table-condensed table-bordered data-table">
            <thead >
            <tr>
            <th style="display:none" scope="col" *ngFor="let column of columns" #th [hide]="!column.visible"
            </th>
            </tr>
             </thead >
             <tbody>
                <tr> <td> data goes here </td></tr>
             </tbody>

</div>
 .styles1 {
  overflow-x:scroll;
  max-height:520px;
  width: 99%;
 }
 .styles2{
  overflow-x:hidden;
  max-height:520px;
  width: 99%;
}