synchronizing scrolling between 2 divs
<p>I saw this post and tried to copy it but it didn't work - 
<a href="http://stackoverflow.com/questions/9236314/how-do-i-synchronize-the-scroll-position-of-two-divs">Syncing scrolling</a></p>

<p>I have a TabContainer with 2 tabs that have divs, bmrDetailDataDiv and residentDetailDataDiv.</p>

<p>Here is my javscript code -</p>

<pre><code>window.onload = function () {
  var bmrDetailDiv = $("div[id$='_bmrDetailDataDiv']")[0];
  var residentDetailDiv = $("div[id$='_residentDetailDataDiv']")[0];

  if ((bmrDetailDiv) &amp;&amp; (residentDetailDiv)) {
      bmrDetailDiv.on('scroll', function () {
          residentDetailDiv.scrollTop(bmrDetailDiv.scrollTop());
      });

      residentDetailDiv.on('scroll', function () {
          bmrDetailDiv.scrollTop(residentDetailDiv.scrollTop());
      });
}
</code></pre>

<p>Am I missing something?</p>

<p>EDIT -</p>

<p>Tried this and get an error - </p>

<pre><code>$(document).ready(function () {
   var bmrDetailDiv = $("div[id$='_bmrDetailDataDiv']");
  var residentDetailDiv = $("div[id$='_residentDetailDataDiv']");
  if (bmrDetailDiv.length &amp;&amp; residentDetailDiv.length) {
      bmrDetailDiv.on('scroll', function () {
          residentDetailDiv.scrollTop($(this).scrollTop()); 
      });
      residentDetailDiv.on('scroll', function () {
          bmrDetailDiv.scrollTop($(this).scrollTop());
      });
  } 
}); 
</code></pre>

<p>EDIT #2 - </p>

<p>Tried this and still getting JScript error. This is all within my .js file that get's included at the top of the page. - </p>

<pre><code>jQuery.fn.exists = function () { return this.length &gt; 0; }

$(function () {
    var combined = $("div[id$='_bmrDetailDataDiv']").add($("div[id$='_residentDetailDataDiv']"));

    if (combined.exists()) {
        //Getting error on below line
        combined.on("scroll", function () {
          combined.scrollTop($(this).scrollTop());
    });
  }
});
</code></pre>
