滚动到页面加载时答案

【问题标题】：Scroll to when page load滚动到页面加载时
【发布时间】：2012-06-20 03:34:56
【问题描述】：

我从这个链接（页尾）得到了一个 jquery 代码： How to scroll to top of page with JavaScript/jQuery?

为什么不在开头使用一些参考元素你的 html 文件，比如

<div id="top"></div>

然后，当页面加载时，只需执行

$(document).ready(function(){

    top.location.href = '#top';

});

如果在这个函数触发后浏览器滚动，你只需这样做

$(window).load(function(){

    top.location.href = '#top';

});

现在，一切正常，但在 google chrome 中却不行！ 我怎样才能为谷歌浏览器修复此代码？ 以及如何在此代码中添加一些动画？比如滚动速度或快、慢等等……

【问题讨论】：

【解决方案1】：

如果你使用 jQuery，你可以使用scrollTop 来滚动。这是一种方法，但它也可以是动画的。这是文档：jQuery API Documentation for scrollTop

你可以这样使用它：

$("html,body").scrollTop(0);

或用于动画：

$("html,body").animate({scrollTop: 0}, 1000);

您可以在任何事件处理程序中设置它：

$(document).ready(function()
{
     $("html,body").animate({scrollTop: 0}, 1000);
}

或者：

$(window).load(function()
{
     $("html,body").animate({scrollTop: 0}, 1000);
}

【讨论】：

定位 HTML 标签和 body 标签在 Chrome 中应该可以正常工作。
谢谢你。现在我如何为这段代码添加速度或动画？ top.location.href = '#top';
我猜不到。您没有设置标量属性，因此无法对其进行动画处理。基本上，动画只是一个递增值的循环。这只是将值设置为无法递增的值。现在，您可以找到#top 元素的垂直位置并将滚动顶部到该垂直位置。您可以通过将提供的动画代码中的 scrollTop 设置为不是 0，而是设置为垂直位置值来做到这一点。
顺便说一下，要找到垂直位置，我相信你使用类似 $("#top").offset().top 的东西。但是，不要引用我的话。
Chrome 30 (Canary) 出现无法立即设置滚动的问题。 $("html,body").scrollTop(0); 不起作用，但这样做：$(window).load(function(){ $("html,body").animate({scrollTop: 0}, 1); });

【解决方案2】：

（我会推荐 lewiguez 在实践中给出的答案，但仍然不确定为什么您的方法在 google chrome 中不起作用。）

这似乎对我有用，但我不确定窗口负载。我通过点击链接测试了实际的“top.location.href”行。

$('#bottomlink').click(function(){
  top.location.href="#top";
  return false;
});

这在页面顶部附近。

<p id="top">lorem ipsum</p>

这是页面底部的链接。

<a id="bottomlink" href="#">Bottom Link</a>

【讨论】：

我需要在页面加载后自动滚动。第一篇文章中的代码正在运行，但不是在 chrome 中。我不需要链接锚或类似的东西。我需要在页面加载后滚动来锚定自动。我有它，但我的问题是谷歌浏览器！
好的，我将 id="top" 放入 body 标签中，现在一切正常。现在我如何为这段代码添加速度或动画？ top.location.href = '#top';