<span id="spantitle" style="width:1000; overflow:hidden;">

  <table width="1280" border="1" cellpadding="" cellspacing="" class="ta01">


  </table>

</span>



<span id="spanmain" style="width:1017;height:520;overflow:scroll;" onScroll="spantitle.scrollLeft=this.scrollLeft;">

  <table width="1280" border="1" cellspacing="" cellpadding="">


  </table>

</span>



위의 span 은 제목요소를

아래의 span 은 내용을...


이런식일 경우 x축 스크롤바를 좌우로 이동할때엔 제목도 함께 움직이지만,

y축의 스크롤바를 위아래로 이동하게 될때는(내용이 많을시) 제목은 고정되고 내용이 담긴부분만 아래 위로 움직인다.


overflow:hidden   // span의 width보다 table의 width가 더 크다. 당연히 overflow된다.

                             그 부분은 화면에 보여지지 않게 하기위함.


span id="spanmain" 부분에 overflow:scroll  // overflow될 경우 스크롤바 나타냄을 의미한다.

                                                                 overflow-y:scroll : y축의 스크롤바만...


onScroll 이벤트 : 아래의 스크롤이 움직일때 spantitle(제목부분)도 움직임을 의미



출처 : http://blog.naver.com/shm98?Redirect=Log&logNo=50012007496

+ Recent posts