Javascript检测浏览器滚动到顶部？答案

【问题标题】：Javascript detect browser scroll to the top?Javascript检测浏览器滚动到顶部？
【发布时间】：2013-05-07 14:52:15
【问题描述】：

如何修改以下代码以检测滚动到首页。

window.onscroll = function(ev) {
    if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
        alert(bottom);
    }
};

编辑：

我正在为 Windows Phone 8 BTW 开发 IE 10

【问题讨论】：

标签： javascript scroll browser

【解决方案1】：

设法弄明白了。这是我的代码：

window.onscroll = function() {

    var body = document.body; //IE 'quirks'
    var document = document.documentElement; //IE with doctype
    document = (document.clientHeight) ? document : body;

    if (document.scrollTop == 0) {
        alert("top");
    }        
};

检查它运行：

window.onscroll = function(ev)
{
	var B= document.body; //IE 'quirks'
        var D= document.documentElement; //IE with doctype
        D= (D.clientHeight)? D: B;
	
	if (D.scrollTop == 0)
		{
			alert("top");
		}        
};

<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

此代码如何工作的说明：

window.onscroll 是将onscroll event 分配给的命令 window 元素。

现在，onscroll 事件被触发 当元素的滚动条正在滚动。，元素将是 window 本身案例。

现在，function 将在事件触发时被调用。

在函数中，我们获取“document.body”来作为en IE的方式得到它。之后，如果有 doctype，我们会得到 documentElement。

然后，这一行是在文档或如果通知document.clientHeight，则为正文。如果被告知，它将文档放在可变文档上。如果没有，它将把身体本身。在此之后，它会检查 scrollTop property 以便知道如果当前滚动位置是“在顶部”

【讨论】：

有人能解释一下这段代码是如何工作的吗？我很难理解它......：/
@AaronMatthews 你有它；）
这个 2015 年的答案对我有用：stackoverflow.com/a/28633515/470749

【解决方案2】：

window.scrollY 不是跨浏览器 according to MDN。在 IEdocument.body.scrollTop，因为 window 的任何属性都不会为您提供当前滚动位置。实际上，document.body.scrollTop 是我最常使用的，因为根据我的经验，它确实有效。

【讨论】：

对不起，我对javascript不是很熟悉。以下不起作用window.onscroll = function(ev) { if ((document.body.scrollTop == 0) { alert("top"); } };jsfiddle.net/4gXN2/17
你有一个语法（额外的括号）停止执行，试试这个更新版本：jsfiddle.net/4gXN2/18

【解决方案3】：

if (document.body.scrollTop == 0 || document.documentElement.scrollTop == 0) 
{
    alert("top");
}

为我工作

https://www.w3schools.com/jsref/event_onscroll.asp

【讨论】：

【解决方案4】：

仅使用 JS 的最佳方法是以下示例添加事件侦听器：

var el = document.getElementById('PUT_YOUR_TOP_ELEMENT_ID_HERE');
el.addEventListener('scroll', function(event) {
    if (event.target.scrollTop === 0) {
        alert('Top of page detected');
    }
}, false);

【讨论】：

【解决方案5】：

其实很简单：

$(window).on('scroll', function () {
  let scrollAmount = window.scrollY;
  console.clear()
  console.log(scrollAmount)
});

【讨论】：

【解决方案6】：

接受的答案给了我一个错误，说“文档未定义”。所以这是我的解决方案。

window.onscroll = function(ev) {
    if ((window.innerHeight + window.pageYOffset) == window.innerHeight) {
        alert(top);
    }
};

这会检查 innerHeight + pageYOffset = innerHeight。这意味着您还可以使用：

window.onscroll = function(ev) {
    if (window.pageYOffset == 0) {
        alert(top);
    }
};

两者都对我有用。

【讨论】：