请教：一个DIV（有横向和纵向滚动条）通过设置2个onscroll，分别控制另两个DIV（一个有横向滚动条，另一个有纵向滚动条）同时滚动，能否实现？


请教各位大侠：
我想设置一个DIV：rightDiv1，有横向滚动条和纵向滚动条，我想让它控制另外两个DIV：leftDiv1（只有纵向滚动条）和topDiv1（只有横向滚动条），当rightDiv1横向滚动时，topDiv1也同时横向滚动，当rightDiv1纵向滚动时，leftDiv1也同时纵向滚动。需求就是要求rightDiv1的横向和纵向滚动条一直在浏览器里可视，而leftDiv1和topDiv1的滚动条需要隐藏。本人是菜鸟，对DIV不太熟，想问一下，在一个DIV里可以写两个onscroll属性吗，即：一个控制横向同时滚动，另一个控制纵向同时滚动，如果不能写两个，那有什么好的解决办法？拜托各位大侠帮助解决！在此先表示感谢了！（解决问题，一定加分）下面是例子程序：<html>
<head>
 
   <script type="text/javascript">
    </script>
 
</head>
<title>test zss</title>
<body  ><!--<div style="width:480; height:350; overflow-y:scroll;"> --><table border='1' width="480" height="300" cellpadding="0"  cellspacing="0" > <tr>

<td colspan="8" >

<table border="1" width="240" height="300" cellpadding="0"  cellspacing="0" >

<tr>
<td>
<table border="1" width="100%" cellpadding="10"  cellspacing="0">
<tr bordercolor="0" >
<td width="30">1</td>
<td width="30">2</td>
<td width="30">3</td>
<td width="30">4</td>
<td width="30">5</td>
<td width="30">6</td>
<td width="30">7</td>
<td width="30">8</td>
</tr>
</table>
</td>
</tr> <tr>

<td colspan="8">

<div id="leftDiv1";  style="width:100%; height:300; overflow-y:hidden; " >
<table border="1" width="100%" cellpadding="10"  cellspacing="0">

<%
for (int i=1;i<100;i++){
%>

<tr bordercolor="1">
<td width="30">1</td>
<td width="30">2</td>
<td width="30">3</td>
<td width="30">4</td>
<td width="30">5</td>
<td width="30">6</td>
<td width="30">7</td>
<td width="30">8</td>
   </tr>

<%}%>

</table>
</div>

</td>

</tr>

  </table>

</td>
<td colspan="16" width="240">

<table>
<tr>

<td>

<div id="topDiv1";  style="width:240;height:100%; overflow-x:scroll;  ">
<table border="1" cellpadding="10"  cellspacing="0">
<tr>
<td width="30">1</td>
<td width="30">2</td>
<td width="30">3</td>
<td width="30">4</td>
<td width="30">5</td>
<td width="30">6</td>
<td width="30">7</td>
<td width="30">8</td>
<td width="30">9</td>
<td width="30">10</td>
<td width="30">11</td>
<td width="30">12</td>
<td width="30">13</td>
<td width="30">14</td>
<td width="30">15</td>
<td width="30">16</td>
</tr>
</table>
</div>

</td>

</tr>

<tr>
<td>


<div id="rightDiv1"; onscroll="leftDiv1.scrollTop = this.scrollTop;"  style="width:240; height:300; overflow-y:scroll; overflow-x:scroll">

<table border="1" cellpadding="10"  cellspacing="0">


<!-- <tr>

<td colspan="16">

<div id="leftDiv1"; style="width:240;height:100%; overflow-x:scroll;  ">

<table border="1" cellpadding="10"  cellspacing="0">
 -->
<%
  for (int i=1;i<100;i++){
%>

<tr bordercolor="1">
<td width="30">1</td>
<td width="30">2</td>
<td width="30">3</td>
<td width="30">4</td>
<td width="30">5</td>
<td width="30">6</td>
<td width="30">7</td>
<td width="30">8</td>
<td width="30">9</td>
<td width="30">10</td>
<td width="30">11</td>
<td width="30">12</td>
<td width="30">13</td>
<td width="30">14</td>
<td width="30">15</td>
<td width="30">16</td>
 </tr>
 
<%}%>

<!-- </table>

</div>

</td>

</tr>
 -->
</table>
</div>
</td>
</tr>

</table>

</td> </tr> 
</table><!-- </div> --></body></html>