javascript - jquery动画网站高度

Question

早上好

我正在创建一个网站，其中有很多动态内容，有些页面小于屏幕，有些页面大于屏幕(因此它使用溢出来显示滚动条，以便您可以滚动到内容。)

我正在寻找是否可以为屏幕设置动画，以便当内容大于屏幕并且用户“向下滚动”以查看内容时内容已更改并且现在更小比屏幕...

此刻，当内容减少时，内容只是跳到最低点..我想要一个流畅的动画到这一点。

示例:

为此，假设屏幕高度为 768 像素。

内容大约 1400 像素长，用户向下滚动页面以查看内容的底部。用户现在单击一个链接，这使得内容只有 300 像素，因此不需要滚动条......屏幕现在会“跳”回网站的顶部/最低位置....

我希望删除“JUMP”并用平滑的向上滚动动画取而代之。

我希望这已经解释了问题。期待您的回答。

Answer 1

您可以使用 jQuery scrollTop很容易:

$('html, body').animate({
    scrollTop: $("#elementToScrollTo").offset().top
}, 500);