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

Javascript detect browser scroll to the top?

提问by PutraKg

How do I modify the following code to detect scrolling to the top page instead.

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

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

EDIT:

编辑：

I am working on IE 10 for Windows Phone 8 BTW

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

回答by PutraKg

Managed to figure it out. Here's my code:

设法弄清楚了。这是我的代码：

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");
    }        
};

Chek it running:

检查它正在运行：

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>

EXPLANATION OF HOW THIS CODE WORKS:

window.onscrollis the command to assign the onscroll eventto the windowelement.

Now, as the onscrollevent gets fired when an element's scrollbar is being scrolled., the element will be the windowitself in this case.

Now, the functionwill be called when the event is fired.

In the function, we get the "document.body" to as en IE is the way to get it. After this, we get the documentElement, if there is a doctype.

Then, this line, is the one that chooses between the document or the body if the document.clientHeightis informed. If it's informed, it will put document on variable document. If not, it will put the body itself. After this, it will check the scrollTop propertyin order to know if current scroll position is "at the top"

此代码如何工作的说明：

window.onscroll是分配的命令onscroll事件的window元件。

现在，当滚动元素的滚动条时onscroll触发事件。，window在这种情况下元素将是它本身。

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

在函数中，我们获取“document.body”，因为 IE 是获取它的方式。在此之后，我们得到 documentElement，如果有一个 doctype。

然后，如果document.clientHeight被告知，这一行是在文档或正文之间进行选择的行。如果它被告知，它会将文档放在可变文档中。如果没有，它将把身体本身。在此之后，它将检查 scrollTop属性以了解当前滚动位置是否“在顶部”

回答by bfavaretto

window.scrollYis not cross-browser according to MDN. On IE<9 you must check document.body.scrollTop, as no property of windowwill give you the current scroll position. Actually, document.body.scrollTopis what I use most frequently, as in my experience it just works.

window.scrollY根据 MDN不是跨浏览器。在 IE<9 上，您必须检查document.body.scrollTop，因为没有属性window可以为您提供当前滚动位置。实际上，这document.body.scrollTop是我最常使用的，因为根据我的经验，它确实有效。

回答by Jonathan Brizio

The best way to do this with only JS is the following example adding an event listener:

仅使用 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);

回答by Mohammad Ghonchesefidi

its really simple:

它真的很简单：

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

回答by Phillip M

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

worked for me

对我来说有效

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

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