title: scroll to top .offset() using percentage %
body: <p>I just wrote this for scrolling pages which is working fine and does what it should..</p>
  
  <pre><code>$('#nav a').click(function(){
  
  var sid = $(this).attr('id');
  
  $('html,body').animate({
   scrollTop: $('#'+ sid +'-content').offset().top - 200}, 1000);
    return false;
  });
  </code></pre>
  
  <p>..but I want the offset to be calculated by % rather then px</p>
  
  <p>ie rather then</p>
  
  <pre><code>top - 200 
  </code></pre>
  
  <p>it could be</p>
  
  <pre><code>top - 30%
  </code></pre>
  
  <p>any ideas how to accomplish this?</p>
  
  <p>As always any help is appreciated and thanks in advance.</p>
  
  <p><em><strong>Quick Edit:</em></strong></p>
  
  <p>The current 3 answers (thank you) seem to multiply each time  which is not what I want, I wish to have a constant gap of 30% window height each time so each time the #id-content is scrolled to the top lines up with a fixed positioned sidebar I have.</p>
  
  <p>My current code leaves a 200px gap but that causes an issue with different monitor/browser sizes where as a % would sort it out.</p>