title: Can't get scrollTop() to work in both Chrome & Firefox
body: <p>I am having trouble getting the scrollTop() method to work in both Firefox and Chrome. I used <code>$('body, html').scrollTop();</code> however, it doesn't work in Chrome. Only <code>$('body').scrollTop();</code> works in Chrome. Any thoughts would be greatly appreciated. Below is my code.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;Demo&lt;/title&gt;
    &lt;style type="text/css"&gt;
    body {
      height: 2000px;
    }
  
    #light {
      display: block;
      position: fixed;
      top: 50%;
      left: 50%;
      margin-left: -400px;
      margin-top: -200px;
      width: 800px;
      height: 400px;
      background-color: blue;
      z-index:1002;
      overflow: auto;
    }
  &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
    &lt;div id="light"&gt;
    &lt;/div&gt;
  
  &lt;!-- Used the google jQuery link for ease of use in this example   --&gt;
    &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript"&gt;
      $(document).ready(function() {
        $(window).scroll(function () {
          var offset = $('body, html').scrollTop();
          var view = $(window).height();
          var total = $(document).height();
          var percent = 1-(offset / (total - view));
          var widthFactor = 800*percent;
          var marginFactor = -(400*percent)
  
          if(percent &gt; 0.33){
            $("#light").css({ "width" : widthFactor,
                        "margin-left" : marginFactor});
          };
        });
      });
    &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>