title: Add padding-top to scroll when using href="#id"
body: <p>I have an anchor tag as follows:</p>
  
  <pre><code>&lt;a href="#map_4D85448A3D4C4180A02BD6FC387ABC45" onclick="jumptosection('map_4D85448A3D4C4180A02BD6FC387ABC45');"&gt;A Guide&lt;/a&gt;
  </code></pre>
  
  <p>It navigates to a section that has the id 'map_4D85448A3D4C4180A02BD6FC387ABC45'. The jumptosection function is as follows:</p>
  
  <pre><code>function jumptosection(id) {
      var target = document.getElementById(id);
      if(document.all){
          document.documentElement.scrollTop = target.offsetTop;
      }else{
          var top = 0;
          do {
              top += target.offsetTop  || 0;
              target = target.offsetParent;
          } while(target);
  
          document.body.scrollTop = top ;
      }
      //$('#article').css.paddingTop = '55px';
      return false;
  </code></pre>
  
  <p>But even if I write nothing in this function, the behaviour is still the same. The problem is that I have a header strip of 92px that hides some part of the section when I click on the given anchor. How do I make it scroll to the given section while adding some pixels to escape the header?</p>