Suppose we have a html page with large height.So there will be a vertical scrollbar.
As the user scrolls down I want to know how much he has scrolled using javascript (jquery) I suppose... Is this possible?
In pure javascript you can simply do like that:
window.onscroll = function (e) {
console.log(window.scrollY); // Value of scroll Y in px
};
More infos (The Mozilla Developer Network) :
removeEventListener
?
Commented
Jun 3, 2018 at 18:19
You can do this using .scroll() and .scrollTop().
$(window).scroll(function() {
// use the value from $(window).scrollTop();
});
See also this question.
This is what i used on my website... when anyone scrolls 620 pixels down the menu will pop up, I input the numbers manually. I'm still a noob at javascript but I hope this helps
<script>
$(document).ready(function(){
$(window).scroll(function(){
var scrollTop = 620;
if($(window).scrollTop() >= scrollTop){
$('.Nav').css({
position : 'fixed',
top : '0'
});
}
if($(window).scrollTop() < scrollTop){
$('.Nav').removeAttr('style');
}
})
})
</script>
You can use window.scrollX to detect how much pixels the user has scrolled right.
You can use window.scrollY to detect how much pixels the user has scrolled down.
You can use window.scrollTo(x, y); to set scroll pixels right (x) and down (y).
var x = window.scrollX, y = window.scrollY;
window.scrollTo(0, 200);
This will work fine in chrome
window.addEventListener('scroll', function() {
console.log(scrollY);
});