使用doubletaptogo.js点击href ="#nav"下拉菜单会导致页面跳转

Question

我有一个下拉使用导航自适应网页doubletaptogo.js,问题是,当我在点击#nav链接以显示下拉项这导致页面scroll down,因此menu现在是在top of the page.

这是页面:http://goligraphist.com.au/development

我发现当我remove all在nav这个问题下面的内容得到修复但这显然不是一个选择.我是新来的javascript,这真的让我陷入困境,任何想法？

示例代码:

<nav id="nav" role="navigation"> 
   <a href="#nav" title="show menu" class="menu-button">
      <img src="img/menu.png" alt="menu icon">
   </a> 
   <a href="#" title="hide menu" class="menu-button">
     <img src="img/menu.png" alt="menu icon">
   </a> 
   <ul> 
      <li class="active">
         <a href="goligraphist.com.au/development">Home</a>
      </li>
      <li>
       <a href="#">Portfolio</a>
     </li> 
     <li> 
       <a href="#">Contact</a>
     </li> 
   </ul> 
 </nav>

jQuery脚本:

<script src="js/doubletaptogo.js"></script> 
<script> 
  $( function() { 
      $( '#nav li:has(ul)' ).doubleTapToGo(); 
  }); 
</script>

Answer 1

好吧，我终于明白了。事实证明，doubletaptogo.js 仅当导航位于页面顶部时才起作用，并且没有办法解决这个问题；如果导航位于任何其他内容（例如标题等）下方，请忘记使用此脚本，因为它总是会导致导航跳转到页面顶部。

我选择了另一种下拉菜单，它只使用 html 和 css，不需要 js 或 jquery。

请参阅http://goligraphist.com.au/development/了解更新。

这就是一个令人头疼的问题的结束。