title: How to I scroll to a set distance above/below an element with JQuery?
body: <p>I have a link shown below, which when clicked on, scrolls the user down to the #contactHeader element. What I want to do is scroll to 200px ABOVE the #contactHeader, rather than directly to it. Is there any way I can add rule which implements a -200px check so that it scrolls to 200px above the element?    </p>
  
  <pre><code>&lt;li&gt;&lt;a id="scrollToContact" href="#"&gt;&amp;bull;&lt;/a&gt;&lt;/li&gt;
  
  $("#scrollToContact").click(function() {
              $('html, body').animate({
              scrollTop: $("#contactHeader").offset().top
          }, 1000);
      });
  </code></pre>