如何同步2 iframe的滚动条

Question

我有一个任务是在一个html页面中启动2个网页并且并排进行网页比较，所以我为每个比较网页创建了2个iframe，但是我在同步滚动条行为时遇到了问题，就像我在左侧网页（iframe1）上移动垂直滚动条一样，右侧网页（iframe2）上的滚动条也会移动。 有谁知道怎么做？或者使用iframe旁边的其他方法，但可以启动2个网页并同步滚动条？ 感谢名单。

Answer 1

您可以使用contentWindow属性访问iframe的窗口。

注册滚动处理程序contentWindow.onscroll，您可以使用scrollTo滚动。

安全提示：iframe的内容应该来自与顶级网页相同的域，然后才能访问contentWindow的值，因为跨域Javascript访问被阻止。

frame1.contentWindow.onscroll = function(e) {
   frame2.contentWindow.scrollTop = frame1.contentWindow.scrollTop;
   frame2.contentWindow.scrollLeft = frame1.contentWindow.scrollLeft;
};