Question

所以当你点击“返回顶部”箭头时它让它完美运行，它隐藏了菜单，但我只是想让它在点击之后进行平滑滚动到页面顶部。您可以在http://rac.site44.com测试我目前所拥有的内容，只需重新调整宽度，以便您处于移动视图（响应中），然后点击右上角的“菜单”图标以查看箭头。

这是HTML

<div class="col_4 no-padding">
  <a href="/">
    <img class="logo" src="img/clear.gif" alt="RAC-Engineering - Structural Engineer Buffalo NY">
  </a>
  <a class="nav-toggle"><span class="mobile-nav-toggle mobile-only"></span></a>
  <a class="nav-toggle2 hidden"><span class="mobile-nav-toggle mobile-only"></span></a>
</div>
<div class="col_8 no-padding last">
  <nav id="nav" class="nav mobile-hide">
    <ul>
      <li><a href="#" class="active">Projects</a></li>
      <li><a href="#">About</a></li>
      <li><a href="#">Contact</a></li>
      <li><a href="#">Links</a></li>
      <li><a href="#">Estimate</a></li>
      <li class="top mobile-only"><a href="#"></a></li>
    </ul>
  </nav>
</div>

和JS :(显然我假设你需要一行代码告诉它在$("li.top").click(function(e) {之后滚动到顶部，但我似乎无法弄明白）

$(function() {
  $("li.top").click(function(e) {
    $("#nav").addClass('mobile-hide');
    $(".nav-toggle").removeClass('hidden');
    $(".nav-toggle2").addClass('hidden');
    e.preventDefault();
  });
});

感谢您的帮助！

Answer 1

我刚刚在您的网站上对此进行了测试：

$("html, body").animate({ scrollTop: "0px" });

您可以在此处阅读.animate()：http://api.jquery.com/animate/

平滑滚动到顶部＆amp;隐藏<div>点击</div>

1 个答案: