Question

我正在使用Pagify.js插件，它通过使用jquery在容器div中提取多个html文件来帮助创建一个页面网站，而浏览器不必刷新整个页面。

问题是我在点击链接时尝试滚动到导航栏div，我得到了奇怪的结果。这是插件和HTML jsfiddle。这是我用来滚动的代码（我不知道在哪里放）

$('html, body').animate({scrollTop:$('#nav').position().top});

http://jsfiddle.net/5y9HT/

如果我将scrollTop代码粘贴到pagify.js中的不同位置，会发生不同的事情，其中没有一个行为完全正确。我试图实现一种情况，即如果点击一个链接，它将滚动到导航div，但如果刷新浏览器则不会滚动（它应该已经存在。就像在这个网站上一样：http://www.madebysofa.com/archive/index.html < / p>

Answer 1

我认为你想要＃nav的偏移，而不是它的位置：

$('.content').on('click', 'a', function(a){
    a.preventDefault();
    $('content').get('newPage.html');
    var nav_position = $('#nav').offset();
    console.log(nav_position);
    $(document).animate({
         scrollTop: nav_position + 'px';
    });
});

您仍然可以以相同的方式使用您的职位（）。顶部。

$('.content').on('click', 'a', function(a){
    a.preventDefault();
    $('content').get('newPage.html');
    var nav_position = $('#nav').position().top;
    console.log(nav_position);
    $(document).animate({
         scrollTop: nav_position + 'px';
    });
});

Answer 2

试试这个，

$('html, body').animate({scrollTop:$('#nav').offset().top}, 1000);

您也可以使用文档而不是同时指定'html'和'body'。希望它有效。

如何控制scrolltop javascript函数？

2 个答案: