[HTML] div를 이용하여 타이틀 상단 고정, 내용만 움직이기

테이블 작업을 했을때 상단은 위아래로 스크롤 할 때는 고정시키고 좌우로만 움직이게 하고 싶을 때가 있다.

HTML

//상단에 고정시킬 div
<div id="scroll_div_1"> 
    <table>
        ....
    </table>
</div>

//내용
<div id="scroll_div_2" onScroll="syncScroll()"> 
    <table>
        Contents
    </table>
</div>

JS

function syncScroll(){  
    var oFrame1, oFrame2;  
    oFrame1 = document.getElementById('scroll_div_1');  
    oFrame2 = document.getElementById('scroll_div_2');  
    oFrame1.scrollLeft = oFrame2.scrollLeft;  
}