使用javascript检测网页顶部的滚动

Question

我想要在用户滚动到网页顶部时，如果他已经位于顶部，我想要这样做。这意味着正常的滚动不应该触发一个动作，就像滚动条位于顶部并且用户进一步滚动到顶部时它做了某事。

我试着用下面的代码，但是当用户到达顶部时触发，而不是当他“过度滚动”它时触发。 Here是jsfiddle。

window.onscroll = function(ev) { 
 
    if ((window.innerHeight + window.scrollY) ==window.innerHeight) { 
 
     alert("The action"); 
 
    } 
 
    document.getElementById('a').innerHTML= window.scrollY+";"+window.innerHeight+";"+(window.innerHeight+ + window.scrollY); 
 
};

p{ 
 
    position: fixed; 
 
}

<br> 
 
<br><br> 
 
<br> 
 
<p id="a">sdf 
 
</p> 
 
<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> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br>

Answer 1

如果这是可以接受忽略像素的顶行窗口，那么你可以在一个像素下设置滚动条的位置。然后如果用户滚动到这个区域，那么好的事情就会发生。

你可以尝试这样的事情小提琴：

var scrolling = false, w = $(window); 
 
w.scrollTop(1); 
 

 
w.on({ 
 
scroll: function() { 
 
    if(w.scrollTop() === 0){ // are we in the 'zero bufferzone'? 
 
    $('#monitor').text('overscrolling'); 
 
    } 
 
     
 
    clearTimeout(scrolling); // reset timer 
 
    scrolling = setTimeout(function() { 
 
     if(w.scrollTop() === 0){ 
 
      w.scrollTop(1); // shift down by a pixel 
 
      $('#monitor').text(''); // reset 
 
     } 
 
    }, 250); 
 
    } 
 
});

body{ 
 
    height: 3000px; 
 
} 
 

 
#monitor{ 
 
    position: fixed; 
 
    left: 1em; 
 
    bottom: 1em; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id='monitor'></div>