Can I synchronize the scrollbars of two iframes?

Question

Possible Duplicate:
How to synchronize scrolling positions for several iframes

I have one HTML page containing two iframes. I want to synchronize the scroll bars of both the iframes. Meaning, if someone moves the horizontal or vertical scroll bar of one iframe then simultaneously the horizontal or vertical scroll bar of the other iframe should move in sync.

You should have searched, there exists on Stack this question: http://stackoverflow.com/questions/762274/how-to-synchronize-scrolling-positions-for-several-iframes Googling your question would also have yielded many results. — Winfield Trail, Aug 03 '11 at 16:35

score 3 · Answer 1 · edited May 23 '17 at 11:45

3

Here are some pointers:

You can access the iframe's window using the contentWindow attribute.
Register a scroll handler, contentWindow.onscroll, and you can scroll using scrollTo.

Security note: the content of the iframe's should be from the same domain as the top-level page, before it can access contentWindow's values, because cross-domain Javascript access is blocked.

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

edited May 23 '17 at 11:45

Community

1
1

answered Aug 03 '11 at 16:35

Pindatjuh

10,550
1
41
68

2

Ritesh, we are not here to write your code for you. – Winfield Trail Aug 03 '11 at 16:48
Note: you are using `facebook.com`, that might not work: only when your page is from facebook.com too. – Pindatjuh Aug 03 '11 at 17:14
You should add the script, it's obviously missing from your page. – Pindatjuh Aug 03 '11 at 19:02

Can I synchronize the scrollbars of two iframes?

1 Answers1