title: clicking on drop down menu with href="#nav" using doubletaptogo.js causes page to jump down
body: <p>I have a responsive page with a drop down navigation using <code>doubletaptogo.js</code>, problem is when I click on the <code>#nav</code> link to show the drop down items this causes the page to <code>scroll down</code> so the <code>menu</code> is now at the <code>top of the page</code>.</p>
  
  <p>here is the page: <a href="http://goligraphist.com.au/development" rel="nofollow">http://goligraphist.com.au/development</a></p>
  
  <p>I have found that when I <code>remove all</code> the content below the <code>nav</code> this issue is fixed but this obviously isn't an option. I'm new to <code>javascript</code> and this has really got me stuck, any ideas?</p>
  
  <p><strong>Sample Code</strong> :</p>
  
  <pre><code>&lt;nav id="nav" role="navigation"&gt; 
     &lt;a href="#nav" title="show menu" class="menu-button"&gt;
        &lt;img src="img/menu.png" alt="menu icon"&gt;
     &lt;/a&gt; 
     &lt;a href="#" title="hide menu" class="menu-button"&gt;
       &lt;img src="img/menu.png" alt="menu icon"&gt;
     &lt;/a&gt; 
     &lt;ul&gt; 
        &lt;li class="active"&gt;
           &lt;a href="goligraphist.com.au/development"&gt;Home&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;
         &lt;a href="#"&gt;Portfolio&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;
  </code></pre>
  
  <p><strong>jQuery Script</strong> :</p>
  
  <pre><code>&lt;script src="js/doubletaptogo.js"&gt;&lt;/script&gt; 
  &lt;script&gt; 
    $( function() { 
        $( '#nav li:has(ul)' ).doubleTapToGo(); 
    }); 
  &lt;/script&gt;
  </code></pre>