jquery - 向上/向下滚动jquery

Question

我想向下滚动到页面中的 div，然后向上滚动一点。

使用jQuery。

我得到了这个 onclick 绑定：

{
 $.scrollTo( $('#theDestDiv'), 1000);
 window.scrollTo(0, (window.pageYOffset)-100 );
}

问题是：window.scroll 在页面完成滚动到 theDestDiv 之前触发，然后 pageYOffset 得到错误的值。

我尝试了 setTimeout ，只有当超时是向下滚动所需的时间时才有效。

任何想法如何解决？

Answer 1

$.scrollTo( $('#theDisclaimer'), 1000);
scroll_up_disclaimer();

function scroll_up_disclaimer(){
    $("html, body").animate({scrollTop:"-=68"})
}

Answer 2

你试过使用jquery的动画完成回调函数吗？您可以在动画完成后运行代码。下面是一个例子。

var scrollTo = $('#theDestDiv').offset(); //find the target
$('html, body').animate({scrollTop:scrollTo}, 1000, function(){
    //on animation complete, scroll back up
    var scrollUp = scrollTo.top-100;
    $('html, body').animate({scrollTop:scrollUp}, 1000);
});

如果您想给它一种“反弹”，我建议您改用 jquery.easing 插件。您想要使用的缓动是 easeOutBack 以便动画通过其最终位置并缓慢返回。http://gsgd.co.uk/sandbox/jquery/easing/