Making navigation links highlight when relevant element passes underneath it, using JavaScript/JQuery?
<p>I have a single page website with the navigation menu <code>position:fixed</code> at the top of the page. </p>

<p>When I click a link from the navigation menu the page scrolls to the appropriate section using this JQuery:</p>

<pre><code>$('a[href^="#"]').live('click',function(event){
     event.preventDefault();
     var target_offset = $(this.hash).offset() ? $(this.hash).offset().top : 0;
     $('html, body').animate({scrollTop:target_offset}, 1200, 'easeOutExpo');
});
</code></pre>

<p>What I'd like to happen is when I manually scroll the page <code>$(window).scroll(function(){...});</code>, relevant to the section passing under the navigation menu <code>#navi-container</code>, the navigation link highlights using <code>.addClass('activeNav');</code>  </p>
