Question

我的页面顶部有一个链接到#here。如何使页面向下滚动到#here的锚链接？我一直在去Google和jQuery网站，但不知道该怎么做。 JS代码就是我所拥有的。

HTML：

<div class="container">
    <div class="header">
       <a class="link" href="#here">Here</a>
    </div>

    <div class="footer">
       <a id="here"></a>
       <p>Some text...</p>
    </div>
</div>

JS：

$('.link').click(function() {
    $(this).scroll()
});

Answer 1

您可以添加：

$('.link').click(function() {
  $("html, body").animate({ scrollTop: $('#here').offset().top }, 1000);
});

Answer 2

如果您将浏览器的位置设置为主题标签，则浏览器应滚动到该位置。

$('.link').click(function() {
   windows.location = $(this).attr('href');
});

Answer 3

此插件添加了一些不错的功能和功能（如不同的动画）： http://demos.flesler.com/jquery/scrollTo/

“将滚动所有匹配的元素，例如：

$('div.pane').scrollTo(...);//all divs w/class pane

如果您需要滚动窗口（屏幕），请使用：

$.scrollTo(...);//the plugin will take care of this“

使用jQuery滚动到锚点链接

3 个答案: