类拟EXCEL表格锁定的功能的实现!

上面为效果图,左右滚动时,标题栏也滚动!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<META content=http://schemas.microsoft.com/intellisense/ie5

name=vs_targetSchema></HEAD>

<BODY>

function doscrollv(obj1)

{

setTimeout("Div2.scrollLeft="+obj1.scrollLeft.toString(),1);

setTimeout("Div1.scrollTop="+obj1.scrollTop.toString(),1);

return false;

}

</SCRIPT>

<TBODY>

<TR>

<TD>

<TABLE id=table2 height=30 cellSpacing=1 cellPadding=1 width=720

border=0><TBODY>

<TR>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>asdf</TD>

<TD noWrap width=120 bgColor=#999999><FONT

color=#ffffff>asdf</TD></TR></TBODY></TABLE></DIV></TD></TR>

<TR>

<TBODY>

<TR>

<TD width=100 bgColor=#999999><FONT

color=#ffffff>a</TD></TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<DIV id=scroll1 style="OVERFLOW: auto; WIDTH: 300px; HEIGHT: 200px"

onscroll=doscrollv(this);>

<TBODY>

<TR>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>1asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>2asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>3asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>4asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>5asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>6asdf</TD>

<TD noWrap width=100 bgColor=#999999><FONT

color=#ffffff>7asdf</TD></TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TR>

<TD bgColor=#999999><FONT

color=#ffffff>111111</TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></BODY></HTML>

注意：需要设置列的宽度！

posted on 2006-03-06 11:56 edobnet 阅读(3715) 评论(2) 编辑收藏举报