实现同一个页面上的两个iframe同步滚动

这是正常的<html> 
<head> 
<style> 
DIV {width:200;height:200;border:solid 1px;overflow-x:hidden;overflow-y:scroll;} 
body {margin:0} 
</style> 
</head> 
<body> 
<div onscroll="ToScroll.scrollTop = this.scrollTop;"> 

<table border="1" width="99%" height="99%">
<tr height="1000">
<td width="99%">

</td>
</tr>
</table>

</div> <div id="ToScroll" style="left:320px;position:absolute;top:0px;"> 
<table border="1" width="99%" height="99%">
<tr height="1000">
<td width="99%">

</td>
</tr>
</table>
</div> 
</body> 
</html> 这是错误的.  为什么加入动态的页面就错啊?
<html> 
<head> 
<style> 
DIV {width:800;height:200;border:solid 1px;overflow-x:hidden;overflow-y:scroll;} 
body {margin:0} 
</style> 
</head> 
<body> 
<div onscroll="ToScroll.scrollTop = this.scrollTop;"> 

<table border="1" width="99%" height="99%">
<tr height="1000">
<td width="99%">
<iframe src="http://www.hao123.com"/>
</td>
</tr>
</table>

</div> <div id="ToScroll" style="left:320px;position:absolute;top:0px;"> 
<table border="1" width="99%" height="99%">
<tr height="1000">
<td width="99%">
<iframe src="http://www.hao123.com"/>
</td>
</tr>
</table>
</div> 
</body> 
</html> 

解决方案 »

  1.   

    http://www.cnblogs.com/DoNetBird/archive/2005/12/06/291583.html
      

  2.   

    我是用JSP的页面.  你提供的是asp 特定标签
      

  3.   

    谢谢 1楼  但是还是不行.
    <html> 
            <head> 
    <script language="javascript">
    function doscroll1()
    {
    div2.scrollTop=div1.scrollTop;
    }
    function doscroll2()
    {
    div1.scrollTop=div2.scrollTop;
    }
    </script> 
    </head> 
    <body> 
    <div id="div1" onscroll="doscroll1()"> 
    <iframe src="http://www.hao123.com"/>
    </DIV> 
    <div id="div2" onscroll="doscroll2()"> 
    <iframe src="http://www.hao123.com"/>
    </DIV> 
      

  4.   

    我提供的是一个解决方案，jsp也好asp也好，在前台的时候都是html。。
      

  5.   

    ifr2.document.body.scrollTop = ifr1.document.body.scrollTop; 
    这句才是关键
      

  6.   

    具体的实现我觉得有以下几个问题
    1、iframe似乎没有onscroll事件
    2、div的事件不能影响到iframe的scroll事件
    3、如果有句柄的情况下 #5的那句能够解决问题。。
      

  7.   

    高手,还是不行啊.  能不能贴个例子.  非常感谢
    <html> 
    <head> 
    <script language="javascript">
    function doscroll1()
    {
    ifr1.document.body.scrollTop = ifr2.document.body.scrollTop;}
    function doscroll2()
    {
    ifr2.document.body.scrollTop = ifr1.document.body.scrollTop;
    }
    </script> 
    </head> 
    <body> 
    <div id="div1" onscroll="doscroll1()"> 
    <iframe id="frm1" src="http://www.hao123.com"/>
    </DIV> 
    <div id="div2" onscroll="doscroll2()"> 
    <iframe id="frm2" src="http://www.hao123.com"/>
    </DIV> 
      

  8.   

    http://www.weste.net/2006/3-5/21383111876.html这个做到了~
      

  9.   

    这些都是静态的内容. 我知道静态的是可以的.  但是问题我的iframe里面是动态的页面.按照他的来修改.也同样不行. 他的代码修改后如下
    <body>
      <table border="1" cellpadding="0" cellspacing="0" width="300" height="400">
        <tr>
          <td height="400" width="50"><iframe name="left" src="http://www.hao123.com" width="50" height="100%"></iframe></td>
          <td height="400"><iframe name="right" src="http://www.hao123.com" width="100%" height="100%"></iframe></td>
        </tr>
      </table>
    </body>
      

  10.   

    就比如是   网络里获取过来的.  src="http://www.hao123.com"
      

  11.   

    如果是本域的其他URL页面呢?
    比如也是通过URL获取的页面信息.
      

  12.   

    我试了这样可以
    <html> 
    <head> 
    <style> 
    DIV {width:200;height:200;border:solid 1px;overflow-x:hidden;overflow-y:scroll;} 
    body {margin:0} 
    </style> 
    </head> 
    <body> 
    <div onscroll="ToScroll.scrollTop = this.scrollTop;"> 
        
        <table border="1" width="99%" height="99%">
                    <tr height="1000">
                        <td width="99%">
                            <iframe src="http://www.hao123.com"></iframe>
                        </td>
                    </tr>
                </table>
        
        </div> <div id="ToScroll" style="left:320px;position:absolute;top:0px;"> 
        <table border="1" width="99%" height="99%">
                    <tr height="1000">
                        <td width="99%">
                        <iframe src="http://www.hao123.com"></iframe>
                        </td>
                    </tr>
                </table>
        </div> 
    </body> 
    </html>