title: javascript. change hash depending on scroll position
body: <p>Have been looking around for a solution/plugin that handles. navigation, menu highlighting and hash change (both on scroll and menu click) but can't really find one. I have this markup of sections for a one page site and i want to implement the bow mentioned in a nice way.</p>
  
  <p>so basically
   - change hash on scroll and menu click (menu also needs highlighting). Both on scroll and when clicked.</p>
  
  <p>EDIT: exactly like this but i need the hash to change on scroll as well.
  <a href="http://callmenick.com/2013/04/22/single-page-site-with-smooth-scrolling-highlighted-link-and-fixed-navigation/" rel="nofollow">http://callmenick.com/2013/04/22/single-page-site-with-smooth-scrolling-highlighted-link-and-fixed-navigation/</a></p>
  
  <p>html</p>
  
  <pre><code>            &lt;nav id="main-nav"&gt;
              &lt;ul&gt;
                  &lt;li&gt;
                      &lt;a href="#"&gt;product&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;a href="#"&gt;process&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;a href="#"&gt;testimonials&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;a href="#"&gt;contact&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/nav&gt;
  
          &lt;section class="main-section" id="product"&gt;
          &lt;/section&gt;
          &lt;section class="main-section" id="process"&gt;
          &lt;/section&gt;
          &lt;section class="main-section" id="testimonials"&gt;
          &lt;/section&gt;
          &lt;section class="main-section" id="contact"&gt;
          &lt;/section&gt;
  </code></pre>