如何在单击jQuery时向下滚动一定距离

Posted 2023-05-08

【中文标题】如何在单击jQuery时向下滚动一定距离

【英文标题】：How to scroll down a certain distance on click jQuery

【发布时间】：2018-04-17 04:31:14

【问题描述】：

当我单击带有动画的按钮到一定距离时，我正在尝试向下滚动页面，目前，我能够向下滚动到某个元素，但这不是我想要的，我想滚动以像素为单位下降到一定距离。

我尝试了很多变体，但它们似乎对我的情况不起作用，至少不是我想要的那样。

不管怎样，代码如下：

$(document).ready(function()
   $('.next_section').click(function()
        $('html, body').animate(
            scrollTop: $('.img_div').offset().top
        , 1000);
   ); 

【参考方案1】：

到一定距离

我假设距离以像素为单位？

这会向下滚动 150 像素：

var y = $(window).scrollTop();  //your current y position on the page
$(window).scrollTop(y+150);

@therealbischero（谢谢！）在评论中提到了我的答案中缺少的部分，如何使其平滑滚动：

var y = $(window).scrollTop();
 $('html, body').animate( scrollTop: y + 150 ) 

【讨论】：

这很棒，知道如何使它平滑滚动，我假设使用 animate() 或其他东西对吗？

将第二行改成 $('html, body').animate( scrollTop: y + 150 )

非常感谢你们，你们是最棒的。