如何给table顶端加水平滚动条

<script language=javascript>
							 function scrollWindow(obj,id)
							 {
							 document.getElementById(id).scrollLeft=obj.scrollLeft
							 }
							 </script> 
							 <div id="div1" style="overflow-x:scroll;width:1050px;height:14" onscroll="scrollWindow(this,'scroll_tab')">
							 <div id="div1" style="width:1400px">&nbsp;
							 </div>
							 </div>
							<div style="overflow-x: scroll;width:1050px" id="scroll_tab"  onscroll="scrollWindow(this,'div1')">
								<table class="table  table-bordered   dataTable"  id="sample_1" style="width:1400px">
<tr><td>22</td></tr>
<tr><td>333</td></tr>
<tr><td>44</td></tr>
<tr><td>55</td></tr>
</table>