Question

I'm currently using a something like this to do stuff on ready and on the scroll event. But I really only need to do stuff each time the page scrolls a full length (window height) and not refire it for every little bitsy scroll. Is there a way to do that using jQuery or native JavaScript?

$(document).ready(function() {
    $(window).scroll(function() {
        // do stuff
    }).scroll(); // Trigger scroll handlers.
});
Was it helpful?

Solution

You can't really fire an event without listening for it, but you can use jQuery's scrollTop() to see if the page is scrolled the same amount as the window height, but it will have to be checked on a certain event, like the scroll event, something like this:

$(window).on('scroll', function() {
    if ($(this).scrollTop() > $(window).height()) {
        alert("scrolled more than window height");
    }
});

OTHER TIPS

There isn't any way to only trigger the scroll at certain points on the page, you'll need to check it everytime... but you might want to consider throttling or debouncing the event.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top