title: Bootstrap 3 Scrollspy highlights the nav element above the selected element until i scroll a few px down
body: <p>So My Scrollspy is working pretty fine. I have a one pager and when i click on a nav element it jumps right away for the correct chapter / heading. But then in the navbar the nav element bevore the selected one is highlighted. Say I have the nav elements Home, About, Contact. I jump to about everything fine - but that Home is highlighted. When i scroll down a few pixel like until the heading is vanished, is about highlighted. 
  I have a fixed navbar, so i have a offset. 
  Here's the JavaScript code: </p>
  
  <pre><code>var offset = 80;
  
  $('.navbar li a').click(function(event) {
      event.preventDefault();
      $($(this).attr('href'))[0].scrollIntoView();
      scrollBy(0, -offset);
  });
  
  $('[data-spy="scroll"]').each(function () {
      var $spy = $(this).scrollspy('refresh')
  })
  </code></pre>
  
  <p>Anyone got an idea? </p>