在页面加载时向下滚动

Question

加载页面时，我需要向下滚动大约 50px。 这是我正在使用的：

$(window).load(function(){
    $("html,body").scrollTop(55);
});

我也试过：

scrollTo(0,55)

这在 Firefox 和 IE 中工作正常，但是在 Chrome、Safari 和 Opera 中它向下滚动到正确的位置，然后跳回到顶部（或最后一个滚动位置）。

我也尝试使用元素 id 向下滚动，但浏览器仍然覆盖它。 我试过这样：

htttp://website.com#element

Answer 1

我认为您的问题是您正在使用 $(window).load 并且某些浏览器存在问题，因为尚未完全呈现。 尝试交换到

$(document).ready(function(){
    $("html,body").scrollTop(55);
});

似乎在所有浏览器中都可以正常工作http://jsfiddle.net/7jwRk/1/

信息

$(document).ready

在加载 HTML 文档且 DOM 准备就绪时执行

$(window).load

当完整页面完全加载时执行，包括所有框架、对象和图像

Answer 2

您可以使用 scrollIntoView() 函数。 大多数浏览器（甚至 IE6）都支持这一点。

document.getElementById('header').scrollIntoView()

Answer 3

<script type="text/javascript">
   $(document).ready(function(){
     var divLoc = $('#123').offset();
     $('html, body').animate({scrollTop: divLoc.top}, "slow");
 });
 </script>

将 id="123" 添加到任何<div>它将在页面加载时自动向下滚动。

如果前一个脚本不起作用，这是另一个脚本！

  <script>
 window.setInterval(function() {
 var elem = document.getElementById('fixed');
 elem.scrollTop = elem.scrollHeight;  }, 3000);
 </script>

将 id="fixed" 添加到任何<div>它将在页面加载时自动向下滚动。

Answer 4

或者，只需在你的身体末端发射这个：

...
    <script type="text/javascript">
        $("html,body").scrollTop(55);
    </script>
</body>
</html>

Answer 5

在弄乱scrollIntoView()并在页面绘制时观察它正确滚动后，然后无缘无故地捕捉到顶部，我继续这样做：

http://website.com/#target

和

<a name="target">

然后浏览器准确地理解我需要什么并执行它。 但我只能这样做，因为我们控制了 URI，所以它自然也不会在所有情况下都有效。

Answer 6

如果您使用 2 台显示器，请确保当您打开浏览器窗口和实现该脚本的页面时，不要将该窗口移动到具有不同屏幕分辨率的另一台显示器。 简而言之：不要将浏览器的窗口切换到不同的显示器，只需为每个显示器/屏幕分辨率打开一个新的浏览器窗口。