在页面加载时滚动到特定的 div答案

【问题标题】：Scroll to specific div on page load在页面加载时滚动到特定的 div
【发布时间】：2019-05-08 23:33:43
【问题描述】：

我试图弄清楚当页面加载后如何让页面自动滚动到特定的 div。我曾尝试使用 jQuery 滚动功能，但无法使其正常工作。有什么建议吗？

以下是我迄今为止尝试过的：

jQuery(function() {
jQuery(window).scrollTop(jQuery('.container').offset().top);
});

【问题讨论】：

标签： jquery html scroll

【解决方案1】：

您可以使用.animate() 方法做到这一点：

$(document).ready(function () {
    // Handler for .ready() called.
    $('html, body').animate({
        scrollTop: $('#what').offset().top
    }, 'slow');
});

这将平滑滚动到 ID 为 what 的 div

FIDDLE

【讨论】：

这可以动态完成吗？我想在查询字符串中发送 div 的名称，例如：show.aspx?divToScrollTo=SecondDiv.
当然可以。只需从查询字符串中获取 div id 并在页面加载时将其传递给上面的代码，例如：$('#' + divToScrollTo).offset().top，其中divToScrollTo 是我们存储查询字符串值的 js 变量。
我要补充一点，如果您对最终位置不完全满意，您可以添加（变低）或减去（变高）一些您想要移动的像素。

【解决方案2】：

$(document).ready(function(){
    $("html, body").animate({ 
        scrollTop: $('.sb-menu').offset().top 
    }, 1000);
});

【讨论】：

【解决方案3】：

首先你必须调用文件，

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">

这里的 id 是“滚动”。以下代码很有帮助：

<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function () {
    // Handler for .ready() called.
    $('html, body').animate({
        scrollTop: $('#scroll').offset().top
    }, 'slow');
});

</script>

</head>
<body>

<div id="scroll"></div>

</body>
</html>

【讨论】：