title: track a scroll position inside an HTML div
body: <p>I am using <code>google visualization table</code> to create an <code>html</code> table, and it enables <code>The header row remains fixed as the user scrolls.</code></p>
  
  <p>I got something working like this: <a href="http://jsfiddle.net/RjHMH/114/" rel="noreferrer">http://jsfiddle.net/RjHMH/114/</a></p>
  
  <p>The problem I am facing is that, when I click a <code>row</code> to expand the table, it actually redraw the table, so that the <code>scroll bar</code> will always be at the top of the table. Is there anyway I can track the current position of the scroll bar when I click, and set the value back when the table is redrawn?</p>
  
  <p>If it is a <code>scroll bar</code> of the <code>DOM</code>, I can use:</p>
  
  <pre><code>var pos = $('body').scrollTop();
  table.draw(view, options);
  window.scrollTo(0, pos);
  </code></pre>
  
  <p>Then how to track the scroll bar inside a <code>div</code>?</p>