0
<body>

<table border="1" width="100%" height="100%">
  <tr>
    <th><iframe id="i1" width="100%" height="100%"src="/wordpress"></iframe></th>
    <th><iframe id="i2" width="100%" height="100%"src="/wordpress"></iframe></th>
  </tr>
</table>

</body>

I have defined two iframes in the same domain. What is want to do is when i scroll iframe with id="i1", the iframe with id="i2" should get scrolled automatically. How can i do this using javascript?

user850234
  • 3,373
  • 15
  • 49
  • 83

2 Answers2

0

Your question was answered in this post: How to get IFRAME to listen to same events as parent (and fire the same handlers)

Just listen for the scroll event instead of mousemove.

Community
  • 1
  • 1
Matthew
  • 15,464
  • 2
  • 37
  • 31
0

To solve your problem, please find code below

function getFrameTargetElement(oI)
{  /* get target document element based on provided frame element */

    var lF = oI.contentWindow;
    if(window.pageYOffset==undefined)
    {
        //IE    
        lF= (lF.document.documentElement) ? lF.document.documentElement : lF=document.body; 
    }
    //- return computed value
    return lF;
}

//- get frame target elements 
var oE1 = getFrameTargetElement( document.getElementById("i1") );
var oE2 = getFrameTargetElement( document.getElementById("i2") );

//- on source scroll
oE1.onscroll = function (e) {
   var scrollTopValue;
   var scrollLeftValue;

   //- evaluate scroll values
   if(window.pageYOffset!=undefined)
    { //opera, firefox,& gecko browsers
        scrollTopValue = oE1.pageYOffset;
        scrollLeftValue = oE1.pageXOffset;
    }
    else
    {
        scrollTopValue = oE1.scrollTop;
        scrollLeftValue = oE1.scrollLeft;
    }   

    //- mimic scroll
    oE2.scrollTo( scrollLeftValue, scrollTopValue); 
}

You can execute it, and test it directly using this link http://jsfiddle.net/CF5Lp/1/

Hope this helps

Seb T.
  • 1,104
  • 12
  • 27
  • Hope this helped you. Please consider marking your question as answered if any of the response you received was the one you consider as valid. – Seb T. Sep 01 '11 at 05:50