在Chrome中，scrollTop()返回0

Question

在Chrome中，scrollTop()返回0

7

我想检查页面是否在加载完成后已滚动，我正在使用以下代码：

$(document).ready(function(){   
    alert($(window).scrollTop());
});

在Firefox中它运行良好，但在Chrome中总是返回0。这是为什么？

- Mihnea Belcin

现在的情况是什么？你是在检查访问者是否使用了#hash标签来访问你的页面？还是在检查访问者是否在文档加载完成之前滚动了页面？或者两者都要检查？ - Andy E

1

我正在对刚刚滚动到视图中的元素运行动画。但是，如果您向下滚动页面并刷新，则重新加载的页面会自动滚动到先前的滚动点（刷新前）。因此，我想知道窗口的滚动位置，以确定页面上哪些元素已滚动到视图中并开始动画。 - Mihnea Belcin

6个回答

2

谷歌浏览器会在DOM加载完成后恢复刷新前的滚动位置。因此，在滚动事件中获取scrollTop而不是在ready事件中获取将起作用。

- Selvaraj M A

2

$(window).scrollTop() 在窗口不可滚动时将返回 0。

- mmcnickle

2

我也遇到了一个问题，就是在Chrome浏览器中，无论我在window、document还是'html,body'上使用scrollTop()方法，始终返回0。最后我发现，问题出在了CSS上：

html, body {
    height: 100%;
    overflow-x: hidden;
}

其实，我也不知道为什么，因为你可以删除这段代码的一部分，然后它就能正常工作。很奇怪，但问题解决了；）

- quape

非常感谢！确实很奇怪！在Safari上工作，但在Chrome上不行，我将这个添加到我的CSS后，两个浏览器都可以正常工作了！ - bbnn

0

在页面中尝试以下代码，该页面底部有一些文本和链接。请记得有足够的文本或空行，以便滚动页面直到您可以看到我的按钮。

 $(document).ready(function () {
        alert($(window).scrollTop()); // first load if you did not scroll = 0
        $("#button").click(function () { alert($(window).scrollTop()); }); 
        // hitting the button that is located on bottom of page 
        // - i had to scroll the page = xxx (68 in may case)
    });

在您的情况下得到 0 是正常的，因为页面没有滚动，您的位置与页面顶部之间的偏移量为 0。

我在 Chrome、FF6 和 IE9 中尝试过。希望对您有所帮助。

- Edd

1

点击 #button 获取 .scrollTop() 不是问题.. 如果您向下滚动页面并刷新，页面将从您滚动到的点（刷新前）开始加载.. 这就是我想要知道的位置。如果您在 Firefox 中执行此操作，将输出正确的值。在 Chrome 14.0 中它返回 0。 - Mihnea Belcin

0

我曾经遇到过同样的问题，但是通过添加文档声明得以解决：

<!DOCTYPE html>

- Carlos Aleman

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- smohadjer · Accepted Answer

实际上Firefox是唯一一个在domReady或window.onload时不返回0的浏览器$(window).scrollTop()。Chrome，Safari和IE都会返回0。获取domReady时滚动条正确位置的唯一安全方法是，如上面另一个答案中所提到的，设置一个window的滚动事件处理程序，代码如下：

$(document).ready(function(){   
    $(window).scroll(function() {
        console.log($(window).scrollTop());
        $(window).unbind('scroll');
    });
});