有时候我们在一个页面中会出现左右两个ifame,这两个iframe内嵌的html页面为相同的,只是渲染的数据不同,然后需要其同步滚动,便于进行比较,如查重。
一、功能实现:
1、在父页面js中编写触发iframe滚动高度的函数,需要分两个,分调用两个不同iframe的滚动条:
/*嵌套的页面滚动*/
function scrollTopA(topNum) {
/*iframe1为iframe标签的name属性*/
$(window.frames["iframe1"].document).scrollTop(topNum);
}
function scrollTopB(topNum) {
/*iframe2为iframe标签的name属性*/
$(window.frames["iframe2"].document).scrollTop(topNum);
}
2、在子页面中,先判断当前页面所在于哪个iframe,然后根据情况调用父页面的的滚动函数:
/*两个对比iframe嵌套页面同步滚动*/
$(window).scroll(function() {
var topNum = $(window).scrollTop();
if(thisName == 'html1') {
parent.scrollTopB(topNum);
}else {
parent.scrollTopA(topNum);
}
});
二、实例如下:
1、