Developement/Web
틀고정 수정버전
highheat
2006. 8. 10. 12:10
<TABLE cellpadding="0" cellspacing="0" border="0">
<TR>
<TD width="100">
<TABLE cellspacing="1" cellpadding="0" border="0" class="main_table">
<THEAD>
<TR height="25" class="main_head">
<TD>Contens</TD>
</TR>
</THEAD>
</TABLE>
</TD>
<TD width="545">
<DIV id="topLine" style="width:545px;overflow:hidden;">
<TABLE width="640" cellspacing="1" cellpadding="0" border="0" class="main_table">
<THEAD>
<TR height="25" class="main_head">
<TD>AAA</TD>
<TD>BBB</TD>
<TD>CCC</TD>
<TD>DDD</TD>
<TD>EEE</TD>
<TD>FFF</TD>
</TR>
</THEAD>
</TABLE>
</DIV>
</TD>
</TR>
<TR>
<TD width="100">
<DIV id="leftDisplay" style="width:100px; height: 120px; overflow: hidden;">
<TABLE cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
</TABLE>
</DIV>
</TD>
<TD width="640">
<DIV id="mainDisplay" style="width:560px;height:120px;overflow-y:scroll;overflow-x:hidden" onscroll="scrollY()">
<TABLE width="640" cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
</TABLE>
</DIV>
</TD>
</TR>
<TR>
<TD width="100" valign="top">
<TABLE cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="0" class="main_foot">
<TD></TD>
</TR>
</TABLE>
</TD>
<TD width="545">
<DIV id="bottomLine" style="width:545px;overflow-x:scroll;overflow-y:hidden;" onscroll="scrollX()">
<TABLE width="640" cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="0" class="main_foot">
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
</TABLE>
</DIV>
</TD>
</TR>
</TABLE>
<SCRIPT>
function scrollX() {
document.all.mainDisplay.scrollLeft = document.all.bottomLine.scrollLeft;
document.all.topLine.scrollLeft = document.all.bottomLine.scrollLeft;
}
function scrollY() {
document.all.leftDisplay.scrollTop = document.all.mainDisplay.scrollTop;
}
</SCRIPT>
<TR>
<TD width="100">
<TABLE cellspacing="1" cellpadding="0" border="0" class="main_table">
<THEAD>
<TR height="25" class="main_head">
<TD>Contens</TD>
</TR>
</THEAD>
</TABLE>
</TD>
<TD width="545">
<DIV id="topLine" style="width:545px;overflow:hidden;">
<TABLE width="640" cellspacing="1" cellpadding="0" border="0" class="main_table">
<THEAD>
<TR height="25" class="main_head">
<TD>AAA</TD>
<TD>BBB</TD>
<TD>CCC</TD>
<TD>DDD</TD>
<TD>EEE</TD>
<TD>FFF</TD>
</TR>
</THEAD>
</TABLE>
</DIV>
</TD>
</TR>
<TR>
<TD width="100">
<DIV id="leftDisplay" style="width:100px; height: 120px; overflow: hidden;">
<TABLE cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
<TR height="20" class="main_head">
<TD>AAA1</TD>
</TR>
</TABLE>
</DIV>
</TD>
<TD width="640">
<DIV id="mainDisplay" style="width:560px;height:120px;overflow-y:scroll;overflow-x:hidden" onscroll="scrollY()">
<TABLE width="640" cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
<TR height="20" class="main_body">
<TD>AAA1</TD>
<TD>BBB2</TD>
<TD>CCC3</TD>
<TD>DDD1</TD>
<TD>EEE2</TD>
<TD>FFF3</TD>
</TR>
</TABLE>
</DIV>
</TD>
</TR>
<TR>
<TD width="100" valign="top">
<TABLE cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="0" class="main_foot">
<TD></TD>
</TR>
</TABLE>
</TD>
<TD width="545">
<DIV id="bottomLine" style="width:545px;overflow-x:scroll;overflow-y:hidden;" onscroll="scrollX()">
<TABLE width="640" cellspacing="1" cellpadding="0" border="0" class="main_table">
<TR height="0" class="main_foot">
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
</TABLE>
</DIV>
</TD>
</TR>
</TABLE>
<SCRIPT>
function scrollX() {
document.all.mainDisplay.scrollLeft = document.all.bottomLine.scrollLeft;
document.all.topLine.scrollLeft = document.all.bottomLine.scrollLeft;
}
function scrollY() {
document.all.leftDisplay.scrollTop = document.all.mainDisplay.scrollTop;
}
</SCRIPT>