title: Scroll Top = Scroll Height not working in Chrome
body: <p>This is the js that I have in my js file</p>
  
  <pre><code>function refreshChat()
      {
          //speed up by selecting the div only once
          var shoutbox = $("#shoutbox");
  
          //get the height of the scroll (if any)
          var oldScrollH = shoutbox.attr("scrollHeight") - 20;
  
          //the ajax request
          $.ajax({
          url: 'shoutbox/update.php',
          //disable cache
          cache: false,
          success: function(html) {
              //update the shoutbox
              shoutbox.html(html);
              //get the heigth of the scroll after the update
              var newScrollH = shoutbox.attr("scrollHeight") - 20;
              if(newScrollH &gt; oldScrollH)
              {
                  //*move* the scroll down using an animation :)
                  shoutbox.animate({scrollTop: newScrollH}, 1);
              }
          }   
          });
      }
      //set the refreshChat function to run every *refreshSeconds*
      setInterval(refreshChat, refreshSeconds);
  
  
  });
  </code></pre>
  
  <p>it works fine in Firefox and IE, but with Google Chrome it constantly flicks. It will scroll to the bottom on page load, but when it calls to the function <code>refreshChat</code> it moves back up about halfway up the div.</p>
  
  <p>I also have this in my <code>&lt;head&gt;</code> </p>
  
  <pre><code>$(document).ready(function(){
          //speed up by selecting the div only once
          var shoutbox = $("#shoutbox");
  
          //get the height of the scroll (if any)
          var oldScrollH = shoutbox.attr("scrollHeight");
  
          //the ajax request
          $.ajax({
          url: 'shoutbox/update.php',
          //disable cache
          cache: false,
          success: function(html) {
              //update the shoutbox
              shoutbox.html(html);
              //get the heigth of the scroll after the update
              var newScrollH = shoutbox.attr("scrollHeight");
              if(newScrollH &gt; oldScrollH)
              {
                  //*move* the scroll down using an animation :)
                  shoutbox.animate({scrollTop: newScrollH}, 1);
              }
          }   
          })
          });
  </code></pre>
  
  <p>so that it will auto load the shoutbox on page load, could this be conflicting with it? It seems logical, but I don't want users to have to wait 3 seconds for the shoutbox to initially load.</p>