title: How to use the scrollTo function?
body: <p>I am looking for a way to scroll from <code>&lt;div id="myButton"&gt;Home&lt;/div&gt;</code> to the centre of another div point . The aim of this is because I have 4 pages and I want them to be horizontally next to each other with a navigation bar (which stays perfectly in the centre) that follows the pages. 
  Why is this not working?</p>
  
  <p>Here is a <a href="http://jsfiddle.net/EzXub/763/" rel="nofollow">JSfiddle</a></p>
  
  <pre><code>$('div#myButton').click(function () {
      $.scrollTo($('div#myDiv'), 500);
  });
  </code></pre>
  
  <p>I have:</p>
  
  <pre><code>&lt;body&gt;
  
  &lt;div id="myButton"&gt;yo&lt;/div&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  .....
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;p&gt;&amp;nbsp;&lt;/p&gt;
  &lt;div id="myDiv"&gt;hello&lt;/div&gt;
  
  &lt;script&gt;
  
  $("div#myButton").click(function() {
   $('html, body').animate({
       scrollTop: $("div#myDiv").offset().top   }, 2000);
   });
  
  &lt;/script&gt;
  
  
  &lt;/body&gt;
  </code></pre>
  
  <p>But it is still not working?!!</p>